Question

我认为我已经在stackoverflow上做了一些示例。但它对我不起作用！这应该是一件很简单的事情。 html结构已设置且无法更改。 CSS是我必须要去的方式。我尝试过绝对和亲戚，但它不适用于其他周围的代码。

<div class="div_lnd_intro">
<div class="lnd_head">
<a class="lndtitle" href="/hantverkshuset/index.php/om-hantverkshuset/nyhetsarkiv/21-arets-foeretagare-2014">Här kan alla medlemmar i vår företagsorganisation nominera till Årets företagare 2014</a>
<span class="lnd_introdate">22 augusti 2013</span>
</div>
<div class="lnd_introtxt"> Nu är det dags att nominera företag till “Årets företagare 2014”. </div>
</div>

.lnd_head {
    border: #C3C solid 1px !important;
    height: 59px !important;
}

.lnd_head a {
    vertical-align: bottom !important;
    height: 100% !important;
    display: table-cell !important;
    float: left !important;
    text-decoration: none !important;
    border: #F66 solid 1px !important;
    max-width: 75% !important;
}

span.lnd_introdate {
    vertical-align: bottom !important;
    height: 100% !important;
    display: table-cell !important;
    float: right !important;
    border: #099 solid 1px !important;
}

.lnd_introtxt {
    clear: both !important;
    float: left !important;
    padding: 0 !important;
    margin: 0 0 10px 0 !important;
}

http://jsfiddle.net/TheWizl/5WU2q/2/

提前致谢

/马格努斯

Answer 1

将display: table;添加到.lnd_head声明块中。从float和span.lnd_introdate声明块中删除.lnd_head a声明。

vertical-align bottom不起作用

1 个答案: