是否可以有一个侧边栏仅通过背景图像/颜色连接到浏览器的左侧但是,无论浏览器大小如何,其中的内容都保持在右侧并且与其他内容的距离相同并且两个内容块居中?
我想也许是百分比,但它与导致问题的右侧列的关系..
You could use a long border and negative margins to achieve this.
http://jsfiddle.net/davidja/TWdXe/2/
.outer {
height:200px;
position:relative;
width:650px; // make your fixed container
margin-left:auto; // center it
margin-right:auto; // center it
}
.inner {
height:200px;
background:red;
width:200px;
display:inline-block;
border-left: solid 1000px red; // long border on the left
margin-left: -1000px; // negative margin to keep the layout
}
.foo {
width:400px;
background:orange;
display:inline-block;
border-right: solid 1000px orange; // long border on the right - optional
margin-right: -1000px; // negative margin to keep the layout - optional
}
body {overflow:hidden;} //Resolves horizontal scrollbar