更新1
似乎以下版本在IE&铬
http://jsfiddle.net/gabel/RYjn6/7/
它仍然是轻量级的,不使用css表单元格样式或一堆包装div。
我们的想法是将图像中的图像浮动并将对齐“中间右侧的”某些文本“对齐到图像。但现在对我来说没有什么工作正常,纵向对齐失败,位置相对根本不起作用。有什么想法吗?
背景 - 图像CSS不可选,因为所有浏览器都无法调整图像大小。
示例:http://jsfiddle.net/gabel/RYjn6/1/
HTML
<ul class="speciallist">
<li>
<a href="#">
<img src="http://farm6.static.flickr.com/5098/5444290347_d398028d26_t.jpg" />
Some Text and some more text and some more text <span style="color: black;"> and some more text</span>
</a>
</li>
<li>
<a href="#">
<img src="http://farm5.static.flickr.com/4104/5444891066_45b883b819_t.jpg" />
Some Text and some more text
</a>
</li>
</ul>
CSS
ul.speciallist li a {
display: block;
width: 95%;
overflow: hidden;
display: inline-block;
text-decoration: none;
background-color: #efefef;
padding: 5px;
margin-bottom: 3px;
}
ul.speciallist img {
float: left;
width: 100px;
margin-right: 5px;
border: 1px solid #888;
}