0 
<ul class="random-list">
   <li>
       <div class="random-container">
           <div class="inline-block" style="vertical-align: top;">
               <img src="" />
           </div>
           <div class="inline-block" style="vertical-align: top;">
               <a href="">Name</a>
           </div>
       </div>
   </li>
</ul>

和CSS：

.random-container {
    margin-bottom: 10px;
    width: 100%;
}
.inline-block {
    display: inline-block;
}

结果：

错误

如何修复此错误：

使固定

4

5 回答 5

6

不如你根本不使用inline-block，并摆脱所有那些不必要的 div。

<ul class="random-list">
   <li>
       <img src="" />
       <a href="">Name</a>
   </li>
</ul>

现场示例

于 2012-06-29T07:40:04.993 回答
1

你的屏幕上有足够的空间吗？您的代码适用于我，因为它适用于这个小提琴：

也就是说：另一个+1是真理的答案。没有必要使用div你当前正在使用的这么多 s。

于 2012-06-29T07:51:09.783 回答
1

给两个元素一个 float: left 将是一个更好的选择。检查这个小提琴。

于 2012-06-29T07:41:48.260 回答
0 
<ul class="random-list">
   <li>
       <img src=""/>
       <a href="">Name</a>
   </li>
</ul>

#random-list
{
   float:left;
}
于 2012-06-29T07:57:24.570 回答
-1

嘿，现在根据你的设计

你给li属性 display:block;

像这样

li{
display:block;
}

或这个

.random-list li{
display:block;
}

现场演示http://jsfiddle.net/GrZLW/

于 2012-06-29T07:43:28.097 回答