浮动边栏总是在右边

我只记得我关于浮动的一些东西：left;并明确：对;让边栏永远在右边。但这不适合我。浮动边栏总是在右边

您在图片上看到的问题是侧边栏被分页div推到了网站的底部。

我的标记是：

<article></article> 
<footer></footer > 
<aside class="sidebar"></aside>

CSS：

aside { 
    float:left; 
    width: 300px; 
    display:inline; 
    margin: 0 10px; 
}

enter image description here

来源

2014-09-22 Caspert

请为提供的css'sidebar' – Compass 2014-09-22 19:03:22

它确实意味着文章中的内容占用了更多的空间，而不是可用于侧栏的空间 – Sunand 2014-09-22 19:05:28

把文章和页脚在一个div并添加float:left给它，然后你给侧边栏float:right像这个：

<div class="left"> 
    <article></article> 
    <footer></footer > 
</div> 

<aside class="sidebar"></aside>

CSS：

.left { 
    float:left; 
} 

.sidebar { 
    float:right; 
}

来源

2014-09-22 19:07:10

我会用宽度百分比只使用左浮动和清除它在页脚像这样：

article { 
 
    width: 80%; 
 
    height: 90%; 
 
    background-color: yellow; 
 
} 
 
aside { 
 
    width: 20%; 
 
    height: 90%; 
 
    background-color: blue; 
 
} 
 
footer { 
 
    clear:both; 
 
    width: 100%; 
 
    height: 10%; 
 
    background-color: red; 
 
} 
 

 
.left{ 
 
    float:left; 
 
    }

<article class="left">ARTICLE</article> 
 
<aside class="sidebar left">ASIDE</aside> 
 
<footer>FOOTER</footer>

来源

2014-09-22 19:22:45

浮动边栏总是在右边

回答

相关问题