CSS - 短边界线？

我在只有左侧的几个DIV上有边框。CSS - 短边界线？

CSS：

#Mid-Content_ { 

    position: absolute; 
    left: 510px; 
    top: 119px; 
    height: 70%; 
    border-left: #CCC 2px solid; 
    width: 250px; 
    padding-left: 10px; 
}

边境从顶部的左侧，这正是它应该根据CSS代码做的底部去。

有没有办法让它更短，比如从顶部和底部说10px？问题是DIV中的文本需要与此边界线内联。

来源

2013-11-14 user2987337

看一看这个fiddle

HTML

<div id="contentArea"> 
     <div id="border"></div> 
     text text text text text text text text text text 
</div>

CSS

#contentArea { 
    height: 100px; 
    width: 80px; 
    position: relative; 
    background: #3beadc; 
    padding:5px; 
    } 

    #border { 
    border-left: 2px solid #f51c40; 
    position: absolute; 
    top: 10px; 
    bottom: 10px 
    left:0px; 
    }

如果你想在边界成为含量 - 面积外，其左值更改为负 *边界宽度*例如left:-2px;在上述情况下

来源

2013-11-14 14:49:26 SW4

啊我明白了。谢谢！ – user2987337

否，边界将始终扩展元素的全长或宽度（例如，内容+填充，但不包括边距）。然而，你总是可以封闭div中的文本在p标签，其语义正确反正和边境添加到代替：

#Mid-Content_ p { 
    padding: 0; 
    border-left: 2px solid #CCC; 
}

此外，在div边界应与文本内联无论如何（或者如果你没有在div上设置明确的高度），假设你有一个正常的ish line-height，并且div上没有顶部或底部填充。

来源

2013-11-14 14:50:25 Ennui

谢谢。虽然内容是少数标题，图像和文字。我发现我需要添加另一个DIV边框。 – user2987337

CSS - 短边界线？

回答

相关问题