2012-03-16 74 views
10

当使用流体布局时,我想要使用[left | content | right]和[left | content]或[content | right]等不同的布局,“单元格”之间的水槽也是流体并具有百分比值。但我想在左/右和内容区域之间有一个固定的宽度,例如10px或20px。引导程序:固定流体布局中的排水沟宽度?

任何建议如何使这项工作?我已经尝试过它,但总是以大幅改变的元素结束。

回答

20

Answered a question like this before,它基本上下来也被创建了一组类取决于你有多少侧边栏有抵消主容器,就像这样:

CSS

.fixed-fluid { 
    margin-left: 240px; 
} 
.fluid-fixed { 
    margin-right: 240px; 
    margin-left:auto !important; 
} 
.fixed-fixed { 
    margin: 0 240px; 
} 

Demo,编辑here

+0

该演示,我怎样才能使3列在主要内容也有一个只有20px的天沟,而不是流体?我猜的侧边栏与上面显示的技术相同?这个周末去玩吧。基本上我想了解如何使用一些流体柱,但是使它们的内容具有固定的排水沟空间。 – burzum 2012-03-16 19:07:02

+0

@burzum im confused,你的意思是你如何得到一个固定的容器?与现在的方式相反?如果你看看'fixed-fixed'类边距,你可以看到它被设置为'margin:0 240px;',侧边栏都是宽度为220px,再加上一个额外的20px(总计240px)的边距以形成您在主容器周围看到的排水沟。 – 2012-03-16 19:13:19