3時間格闘した末に解決できなかったので お願いします。
jqueryでタブメニューを作っています。
タブメニューは実際に動いてくれたもののデザインが
思うようにいかなくて困っています。
まずは本題 ボタン編
div 要素の中に ul要素 をすっぽりと入れたい。
div・・・ 高さ 70 横 200
ul・・・ 高さ 70 横 200
html
1<!-- タブメニューのトリガー --> 2<div class="button"> 3 <ul> 4 <!-- leftをタッチするとLEFTTABが出ます --> 5 <li id="left" class="selected">left</li> 6 <!-- rightをタッチするとRIGHTTABが出ます --> 7 <li id="right">right</li> 8 </ul> 9</div>
css
1body{ 2 margin: 0; 3} 4 5.button{ 6 width: 200px; 7 height: 70px; 8} 9 10.button ul{ 11 width: 200px; 12 height:70px; 13} 14 15.button ul li{ 16 list-style: none; 17 display: inline-block; 18}
実行結果
こちらはulをつつむdiv要素
↓こちらはdivの中に入れたいul
見にくいですがul要素がdiv(class="button")から40pxほどはみ出しているのが分かります。
この謎の隙間の原因はなんでしょうか?
この隙間をなくしてdiv要素の中にul要素を全く同じ大きさでかぶせたいのです。
参考になるリンクまたは説明をお願いします。
回答による解決方法
css
1ul{ 2 padding: 0; 3}

回答3件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2019/07/11 00:34