在Twitter Bootstrap中如何做一个简单的内部容器？

下面是我想要实现的图像：http://i.imgur.com/XKPuV.png 在Twitter Bootstrap中如何做一个简单的内部容器？

我想要一个带有边框和灰色背景的内部容器的外部容器。在内部容器中有两个块：左侧的文本，右侧的图像（两侧的元素不重要 - 可以是任何内容）。很基本的东西。

下面的代码，我有我的两个div，跨越6列分开（这是它看起来像：http://i.imgur.com/BEIVl.png）。解决此问题的最佳方法是什么？

<div class="container" style="border: 1px solid gray;height:490px;margin-top:20px;"> 
<div id="inner-container" style="background:gray;margin:5px;"> 
    <div class="row"> 
     <div class="span6"> 
      <p style="margin:5px;"> 
       Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi. 
      </p> 
     </div> 
     <div class="span6"> 
      <p style="margin:5px;"> 
       Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi. 
      </p> 
     </div> 
    </div> 
</div>

来源

2012-06-04 Mike

的问题是，你不能指定行内边距和补与SPANX类，因为这些在覆盖自举自己的填充/保证金的设置（这就是为什么第二次DIV继续下一行。我建议你创建你所需要的，而不使用内部div的spanX定义。请参阅小提琴：http://jsfiddle.net/periklis/KGMEF/1/

来源

2012-06-04 18:53:52 periklis

我看了一下你的示例代码 - 两个div分开，我正在寻找一个固体容器来容纳他们都是。我在op上张了一张照片，所以你可以看到。 – Mike

我放了一个边缘他们，这就是为什么。我更新了小提琴，看看：http：//jsfiddle.net/periklis/KGMEF/2/ – periklis

谢谢，这看起来不错。我甚至在更新之前将其标记为答案，因为我明白你要去哪里。 – Mike

在Twitter Bootstrap中如何做一个简单的内部容器？

回答

相关问题