0

我有以下html:

<span class="icon-top-margin-4 margin-right sprite-book-open"></span>
<p>Topic: No Topic Title</p>

和 CSS:

.icon-top-margin-4 {
    background-color: red;
    content: " ";
    background-image: url(/Images/fugue/sprite.png);
    background-repeat: no-repeat;
    display: inline-block;
    height: 16px; 
    vertical-align:bottom;
    width: 16px;
    line-height: 16px;
}

.sprite-book-open{ background-position: 0 -288px;  } 

我想要的是段落在图标之后开始,但它从新行开始。有没有办法让它与图标在同一行开始?我确实尝试在段落上向左浮动,但这使它在图标之前。

4

3 回答 3

2

p 是块元素,所以它进入新行,你应该把它设为inline.

添加 .icon-top-margin-4 + p{display:inline;}

' + ' 选择器选择提到的类的紧邻的下一个元素。

现场演示

于 2012-11-29T10:54:48.747 回答
1

您还可以简单地spanp.

于 2012-11-29T10:56:43.090 回答
0

您可以将段落样式设置为display: inline

于 2012-11-29T10:57:36.993 回答