0

次のマークアップがあります。

<ul data-role="listview" data-inset="true" class="stuff site-content lists">
      <li>
        <div class="nearby"> 20 </div>
        <h1> name</h1>
      </li>
</ul>

cssは：

.nearby{width: 85px; 
   height: auto; 
   float: left;
   margin-right: 10px; 
   font-size: 26px; 
   text-align: center; 
   padding: 15px 0; 
   border: 2px #c1c1c1 solid; 
   background: #fafafa; 
}
li{padding: .7em 15px;
   display: block;
}

残念ながら、div は高すぎるため、真ん中にうまく収まりません。とにかく、パディングが?ではなくliに依存するように、アイテムの高さも増加する可能性があります。divh1

4

2 に答える 2

3

機能させるには、以下を追加する必要があります。

li{overflow:hidden;}

浮動要素の親を に設定すると、overflow:hidden;強制的に浮動コンテンツ全体がラップされます。これは非常に便利なテクニックで、よく使われます。

于 2013-08-21T13:21:31.780 に答える
0

float:left ul と li の両方に設定します 私はいつもこの問題を抱えています 試してみてください

于 2013-08-21T13:21:50.390 に答える