1

我想在一张图像上放置几行文本,它们之间的间隔相等。

我认为使用相邻的选择器是这样的:

.text-box + .text-box{
    margin-top:40px;
} 

会在每个连续元素之间引入 40 px 的间隔text-box,但我发现它只适用于第二个和第一个元素之间,因此第三个元素放置在与第二个元素相同的位置,即与第一个元素有 40px 的边距元素,而我期望第二个元素的边距为 40px,因此距第一个元素的边距为 40+40px。

有可能这样做吗?

这是我的代码:CSS:

.text-box{
    z-index:100;
    position:absolute;
    right: 600px;
    background-color:#404042;
    color:#ffffff;
    padding:6px 10px;
}

.text-box + .text-box {
    margin:40px 0px;
}

HTML:

<div class="container">
    <div id="logo"><img src="images/image.jpg"></div>
    <div class="text-box">some text</div>
    <div class="text-box">some other text</div>
     <div class="text-box">some other text</div>
 </div>
4

1 回答 1

0

问题在于你的绝对定位。删除它,可以应用边距。

演示图像上的文本(这似乎是意图):http: //jsfiddle.net/EqXYA/1/

于 2012-09-18T15:39:17.693 回答