将<h3> </h3>与我的图像问题的底部对齐

Answer 1

我就是这样做的：

#loop-body{
    position: relative
    width: ...px
    ...
}

#loop-body h3{
    position:absolute;
    bottom: 0;
    right: 0;
    ...
}

Answer 2

完成了。

您需要更改HTMls结构和一些CSS调整，

HTML：

<article id="loop-body">
      <div class="cContent">
            <a href="#">Title 2</a>
            <p>Post 1</p>                        
      </div>
      <div class="cImage">
            <img src="img.jpg" style="height:130px;width:auto" />
            <h3> Read more> </h3>
      </div>

</article>

CSS：

article{padding:10px;}
.cContent {float:right;width:400px;}
.cImage{position:relative;}
.cImage h3{position:absolute;bottom:0;right:0;margin:0;}

JSFIDDLE 此处。

请注意我离开最后一个取消以供参考。 而忽略了长图像链接，只需从Google轻松获取。

Answer 3

我已解决您的问题，请访问Link

#loop-body h3{font-family:'bariol_boldbold'; font-size:14px; right:0; bottom:-15px; position:absolute;}