Question

我有一个用于IAB广告牌广告的子标题容器，需要在广告应居中的容器中考虑两种不同宽度的广告。

我的问题是 - 有没有使用自动宽度在中心元素上没有宽度的变通方法？

我的基本代码结构如下：

<div class="sub_header_wrap" style="width:970px">
    <div class="ad" id="pencil00" style="margin:0 auto;min-height:30px">
        <!-- some ad code -- may be 970px or 950px wide -->
    </div>
</div>

我在这里找到了另一个解决方案，但在尝试使用它之前我想知道这些警告。除了我的完整代码中的广告位置之外，sub_header_wrap容器中还有其他元素。他们可能会受到这种解决方案的不利影响：

<div class="sub_header_wrap" style="width:970px;text-align:center">
    <div class="ad" id="pencil00" style="text-align:left;display:inline-block;min-height:30px">
        <!-- some ad code -- may be 970px or 950px wide -->
    </div>
</div>

此解决方案似乎在.sub_header_wrap容器中生成了额外的4px计算高度。

Answer 1

解决方案是......

<div class="sub_header_wrap" >
    <div class="ad" id="pencil00" style="margin:0 auto;min-height:30px;max-width: 970px;text-align: center;">
        <!-- some ad code -- may be 970px or 950px wide -->
    </div>
</div>

或

<div class="sub_header_wrap" style="width:970px;text-align:center">
    <div class="ad" id="pencil00" style="text-align:left;display:inline-block;min-height:30px; margin-bottom: -4px;">
        <!-- some ad code -- may be 970px or 950px wide -->
    </div>
</div>

CSS中心带有自动边距但没有宽度

1 个答案: