0

请参阅下面的代码。我正在尝试将名称与图像对齐，以使名称位于图像的右侧。我一直无法正确地做到这一点。我尝试添加 position: absolute; 但这仍然无法解决问题。

    <div id="contain">
    <div id="baseline">

    <div id="title2">

    <img src="http://www.marketingjava.com/wp-content/uploads/2012/01/
    new-default-twitter-avatar.jpg" id="prof_image">Ariel Smith</div>
    </div>

    CSS:

    #contain {
    width: 770px;
    min-height: 170px;    
    margin: 20px auto 60px auto;
    color: #222222;
    font-size: 15px;    
    position: relative;
    }
    #baseline {
    color: #999;
    }

    #title2 {
    color: #000;
    font-size: 30px;
    margin-left: 10px;
    padding-bottom: 5px;
    padding-top: 5px;
    width: 750px;
    }
4

3 回答 3

4

向左浮动并使用边距调整标题以使其居中。

http://jsfiddle.net/FBj3f/

于 2012-05-01T01:43:43.670 回答
1

如果您知道图像的高度，则可以设置标题的行高，从而产生垂直居中的标题http://jsfiddle.net/BtPwh/1/

如果您不反对使用表格，那么您可以自动（不需要图像高度。）这样做：http: //jsfiddle.net/tLggp/1/

于 2012-05-01T01:35:28.933 回答
0

最简单的方法是设置使用背景图像而不是图像元素。然后，您可以右对齐该块中的文本，从而实现右上角定位。

于 2012-05-01T01:32:57.853 回答