水平对齐多行中的元素

时间:2015-09-24 08:56:28

标签: css

我正在开发一个生成在线分类列表的webapp。现在,如果查看列表中的第一个和第二个元素,小图像将无法正确对齐:

enter image description here

<div class="item">
    <abbr2 class="date dtstart value item_age" title="2013-05-07T12:48:07+0000">
        Today
        <br>13:23
    </abbr2>

    <a lang="" class="item_img" tabindex="1" href="/vi/5775056084926464.html">
        <img src="http://lh3.googleusercontent.com/jscy04U7d2qfgGe6PecBDv63HpzeNnIHn62_hk71A0yYM6Vdw7_OwcnaeCotDjMg4e7i07bJwdLgPhM7QlqW35HK=s65" title="Post Free Ads - List your advertisement" alt="Post Free Ads - List your advertisement">
    </a>

    <div class="item_info">
        <h3 class="item_subject">
            <a href="/vi/5775056084926464.html">Post Free Ads - List your advertisement </a>
        </h3>
        <!-- s -->
        <p class="item_teaser">Post Free Ads on top sites. ...
        </p>

        <div class="item_segments clean_links nohistory">
            <small>
                <a class="category" href="/q?query=category%3D6030+and+cityID%3D4691207+and+type%3Ds">
                    Services
                    <br>
                    For sale,
                    Madgaon, Goa</a>

            </small>
        </div>
    </div>
    <div class="item_price">
    <span class="price_span"></span>
    </div>
</div>

我创建了一个问题fiddle

1 个答案:

答案 0 :(得分:4)

设置宽度

<强> CSS

.date{
    width: 60px;
}

<强> DEMO HERE