0
#index .post-tnail {
position:relative;
margin:0 0 10px -4px;
}

#index .post-tnail img {
position:relative;
float:left;
display:block;
width:200px;
height:auto;
background:#1c1c1c;
border:1px solid #2a2a2a;
padding:3px;
}

#index .post-content {
margin:0 0 10px -4px;
position: relative;
}

<div class="post-tnail">
    <a href="#"><img src="images/news/1.jpg" alt="Img" title="Img" /></a>
</div>                          

<div class="post-content">
    <p>Some text</p>
</div>

问题是这样的。

| [IMAGE]Text1 |
| Text2        |
| Text3        |

Text1 离图像太近。text1 和图像之间应该有 15px 的距离。

我究竟做错了什么?

4

2 回答 2

0

<img>- margin-right: 15px由于 img 是浮动元素,文本上的边距和填充将无法正常工作:

#index .post-tnail img {
    margin-right: 15px
{
于 2013-01-31T07:13:47.203 回答
0

在图像上放置一个margin-right(或者margin-bottom,如果它是问题所在的图像下方的空间)。像这样:

#index .post-tnail img {
position:relative;
float:left;
display:block;
width:200px;
height:auto;
background:#1c1c1c;
border:1px solid #2a2a2a;
padding:3px;
margin-right:5px;
}
于 2013-01-31T07:19:55.147 回答