Question

我有一个带有底部边框的div，无论我是尝试向左还是向右填充，边框都会延伸到底部填充。

如何将边框限制为仅边框的最大长度，不包括填充或边距（左，右）？

CSS

div.row.banner div.links
     display: inline-block
     height: 40px
     margin: 0px
     border-bottom: 2px solid #5cdde0

div.row.banner div
     display: inline-block
     height: 25px

HTML

<div class="col-sm-4 nopadding pull-right">
    <div class="links pull-right">
        <div class="active pull-left"><a href="">Test Link 1</a></div>
        <div class="active pull-left margin-left"><a href="">Test Link 2</a></div>
        <div class="active pull-left margin-left"><a href="">Text Link 3</a></div>
    </div>
</div>

Answer 1

好吧，边界问题是由于我将边框应用于每个锚标记div的封闭div。

我修改了下面的原文

div.row.banner div.links
     display: inline-block
     height: 40px
     margin: 0px
     border-bottom: 2px solid #5cdde0

以下

div.row.banner div.links
     display: inline-block
     height: 40px
     margin: 0px

div.links div.active
     border-bottom: 2px solid #5cdde0

从而使边框仅适用于内部div而不是容器。

CSS / Bootstrap / HTML - 底部边框和填充的Div ...如何防止边距或填充边框的扩展？

1 个答案: