0

プロパティを持つコードがいくつかありますdisplay-inline。これにより、リストが横に表示されます。ここで、コードに画像を配置すると、リストの後に表示されました。画像をリストの下に表示したかったので、リストを div に配置しましたが、それでもリストの横に表示されます。ここにコードがあります、

<ul id="list-nav">
    <li><a href="#">Home</a></li>
    <li><a href="#">About Book</a></li>
    <li><a href="#">Contact</a></li>
  </ul>
</div><!--navigation div ends-->
<!--<div>-->
<img src="Book_Cover-465x540.png" />

list-nav の CSS:

ul#list-nav {
margin:40px;
padding:0;
list-style:none;
width:525px;
}
ul#list-nav li {
display:inline
}
ul#list-nav li a {
text-decoration:none;
padding:5px 0;
width:100px;
background:#000000;
color:#eee;
float:left;
}
ul#list-nav li a {
text-align:center;
border-left:15px solid #fff;
}

助けてください。ありがとう

4

2 に答える 2

0

からフロートを削除しaます。また、一体何border-left:15px solid #fff;ですか、あなたは左マージンを意味しませんでしたか？

于 2012-05-17T16:39:53.057 に答える
-1

これを試して：

<div>
<ul id="list-nav">
    <li><a href="#">Home</a></li>
    <li><a href="#">About Book</a></li>
    <li><a href="#">Contact</a></li>
  </ul>
</div><!--navigation div ends-->
<!--<div>-->
<div style="clear:both"></div>
<img src="Book_Cover-465x540.png" />
于 2012-05-17T16:39:42.353 に答える