Question

我正在尝试布局一个简单的表单，但我不确定是否采用了正确的方式。我的第一个问题是：如果我有以下html

<div class="row">
    <div class="span6">
        text text
    </div>

  <div class="span6">
       text text
   </div>
</div>

有没有办法制作适用于span * class的较小的margin-left规则？我的意思是，这里的第二个div将比第一个div剩余30px，但是如果我想让它只有10px，那该怎么做呢？

第二个问题：如果我有以下html

 <div class="row">
        <div class="span6">
            <label>text2</label> 
             <select>
                  <option>5</option>
          </select>
        </div>
</div>

只要父div为宽，如何使选择按钮占用宽度空间？我尝试将宽度：100％添加到选择中并且它工作正常，但是当添加填充时，选择比父级更宽？

Answer 1

如果您选择100％然后添加填充，则宽度变为100％+填充。

您可以将宽度设为94％并添加3％填充，以使总数达到100％。

select {
    width: 94%;
    padding: 3%;
}

如果您为select元素添加边框，这也将包含在宽度计算中，因此您必须相应地调整值。

您还可以考虑使用CSS3框大小，但我不能100％确定它是否适用于选择：

http://css-tricks.com/box-sizing/

使元素足够长以适应引导程序中的父div框

1 个答案: