在bootstrap列中的Div在iOS上的safari中不会拉伸

Question

我需要的是使用bootstrap.js网格系统连续放置12个div。 此行的每一列都需要有一个边框。所以，如果我把12个div与css-class放在一列（xs-col-1） 当我为每列放置一个1像素的边框时，它会断开。

所以我的想法是有一个内在的div。问题是内部div没有伸展。我试图加入：100％，但这没有区别。内部div中的字符超出了内部div的边界。内部div占据父级宽度的10％左右（xs-col-1）。

因为我在手机上需要这个，我使用的是xs-col-1。我不能指定内部div的宽度（以像素为单位）。 有办法解决这个问题吗？

以下是父级内部边框的代码。这里的问题是12列不在同一行，列号12将转到下一行：

<div class="row">
    <div class="col-xs-1" style="border:1px solid black;">
        <div style="width:200%;">A</div>
    </div>
    <div class="col-xs-1" style="border:1px solid black;">
        <div style="width:200%;">A</div>
    </div>
</div>

这是放在孩子里面的边框的代码。这里的问题是孩子的宽度不会伸展。孩子内部的字母比内部div本身宽得多：

<div class="row">
    <div class="col-xs-1">
        <div style="width:200%;border:1px solid black;">A</div>
    </div>
    <div class="col-xs-1">
        <div style="width:200%;border:1px solid black;">A</div>
    </div>
</div>

Answer 1

解决方案似乎是使用“display：table”。 当我把它放在内部div中时，它会拉伸。