【问题标题】:Twitter Bootstrap: hiding a row-fluid container without the row's other containers to the right sliding left?Twitter Bootstrap:隐藏一个行流体容器而没有该行的其他容器向右滑动?
【发布时间】:2012-05-18 06:08:34
【问题描述】:
我正在处理包含一些动态内容的页面。主要布局在同一流体行内的 3 个容器中。我希望第一个容器要么显示两种类型的列表中的一种,要么不显示——因页面状态而异。
但是,当我尝试使用 $("#container-id").hide() 之类的 jquery 函数删除元素时,它会将容器向右滑动到左侧,从而使页面布局倾斜。有没有办法在其他容器不向左移动的情况下将这个容器从视图中移除?
以下是正在发生的事情的示例:
http://jsfiddle.net/PHaeA/27/
下面是我希望容器在第一个不存在时如何显示的示例:http://jsfiddle.net/gLTyF/5/
谢谢!
【问题讨论】:
标签:
html
css
twitter-bootstrap
【解决方案1】:
听起来最简单的解决方法是(如果可能)在包含内容的范围内添加一个 div,并隐藏 that 而不是整个列。
另一种方法可能是覆盖 twitter 引导样式,使其向右浮动而不是向左浮动:
.row-fluid [class*="span"] {
float: right; }
但我猜这更有可能导致意想不到的后果。
【解决方案2】:
如果你想保留空间,你可以使用
$('#col1').css({visibility:"hidden"});