tdとul-html、cssの間の不要なスペースを削除する際に助けが必要

tdとulの間のスペースを削除できません。以下は tdとul-html、cssの間の不要なスペースを削除する際に助けが必要

がこれを実行するには、コード

<html> 
<head> 
<link href="gs.css" type="text/css" rel="Stylesheet" /> 
</head> 
<body> 
<table width="100%"> 
<tr> 
<td width="100%" class="posMenuLevel1" style="border :1px solid gray;"> 
<br /> 
<ul class="menuLevel1"> 
<li> 
<a href="" >ABCD</a> 
</li> 
<li> 
<a href="" >EFGH</a> 
</li> 
<li> 
<a href="" >IJKL</a> 
</li> 
<li> 
<a href="" >MNOP</a> 
</li> 
</ul> 
<br /> 
</td> 
</tr> 
</table> 
</body> 
</html>

gs.css

.posMenuLevel1 
{ 
text-align: left; 
vertical-align: top; 
} 

.menuLevel1 li 
{ 
display: inline; 
list-style-type: none; 
} 

.menuLevel1 li a 
{ 
padding: 5px; 
text-decoration: none; 
background-color: #EE7600; 
color: #000000; 
} 

.menuLevel1 li a:visited 
{ 
color: #000000; 
} 

.menuLevel1 li a:hover 
{ 
text-decoration: underline; 
}

の作品である、あなたは、メニュー/リンクを開始する直前に、左側にスペースがあることに気づくでしょう。

右揃えをしても、スペースは表示されません。左

任意の助けにそれらを合わせながら、スペースが表示される理由について

わからないいただければ幸いです。ありがとう

出典

2010-12-05 Bullet Eye

ulには、リスト項目のインデントを提供するために、デフォルトで余白/パディングがあります。あなたはそれをリセットする必要があります。http://meyerweb.com/eric/tools/css/reset/：

.menuLevel1 {margin: 0; padding: 0;}

出典

2010-12-05 18:00:11 prodigitalson

ありがとうございます！作品！ :) –

は、実際にはあなたも、例えば、エリック・マイヤーのアプローチを使用して、デフォルトのCSSルールをreseting検討すべきであるtable {border-collapse: collapse;} & ul {margin:0; padding:0;}

出典

2010-12-05 18:00:44 meo

ありがとう。作品... :) –

を試してみてください。

これは、多くの同様の問題、特にクロスブラウザの問題を解決することができます。

出典

2010-12-05 18:35:13 Flack

tdとul-html、cssの間の不要なスペースを削除する際に助けが必要

答えて

関連する問題