私はしばらくこれで遊んでいましたが、今は仕事に就こうとしています。私がやっていることの簡易版へのリンクを投稿します。
<ul>
インラインで表示するセットがあり、それぞれ<li>
の幅は 25% で、見つけたすべてのものからパディングとマージンが削除されています。理論的には、各リスト項目がコンテナ内で同じスペースを占めるべきではないのですか? そうではありません。選択したメニューに、私が気付いていないデフォルトで余分なパディングが含まれているかどうかに興味があります。皆さんの助けに感謝します。
HTMLは次のとおりです。
これを試して:
/*--CSS--*/
html body{
padding: 0;
margin: 0;
}
.container{
width: 100%;
height: 40px;
background: yellow;
text-align: center;
padding: 0;
margin: 0;
}
.container ul{
list-style: none;
height: 100%;
padding: 0;
width: 100%
}
.container ul li{
display: inline-block;
line-height: 40px;
padding: 0;
width: 25%;
float:left;
}
.container select{
height: 40px;
padding: 0;
background: orange;
}
<!--HTML-->
<section class="container">
<ul>
<li> one</li>
<li><select>
<option>TwoA</option>
<option>TwoB</option>
<option>TwoC</option>
</select>
</li>
<li>three</li>
<li>four</li>
</ul>
</section>