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;不与媒体合作查询

回答

相关问题