float：none;不與媒體合作查詢

我下面一個關於響應式設計教程，並試圖將float屬性設置爲none對媒體查詢有一類main如下面的規則集瞄準(max-width: 625px)的部分時：float：none;不與媒體合作查詢

/* Section main */ 

section.main { 
    background-color: blue; 
    width: :100%; 
    float: none; 
    text-align: left; 
} 

section.main aside div.content { 
    background-color: green; 
    margin: 8px 20px 8px 0; 
    padding: 5px 0px 10px 85px; 
    background-size: 50px 50px; 
    background-position: 20px 5px; 
}

以下是完整的HTML和CSS代碼一起：jsfiddle（我加的藍色的section.main和綠色在這些相同的媒體查詢規則集的section.main aside div.content，以確保他們對HTML效果並使其易於位於頁面中。

這三個綠色的divs應該在浮動設置爲無時垂直疊放。

來源

2016-11-16 Bardelman

你在＃377行上有一個錯字。從'width：：100％'中刪除多餘的'：';我希望它能解決你的問題。 –

爲什麼你需要使它浮動：沒有;當它還沒有浮動時？ –

@Muhammad Usman謝謝，我修復了錯字，但浮動問題仍然存在 – Bardelman

here：JSfiddle我編輯了你的小提琴，想出了這個。希望這個示例有幫助。

section.main aside { 
     float: none; 
    display: block; 
    width: 100%; 
    } 
    section.main aside div.content { 
     background-color: green; 
     margin: 8px 20px 8px 20px; 
     padding:20px 15px; 
    text-align: center; 
     background-size: 50px 50px; 
     background-position: 20px 5px; 
    }

來源

2016-11-16 08:21:48

float：none;不與媒體合作查詢

回答

相關問題