Question

我正在使用ul，li元素

编写用于导航的html代码

我的HTML是。

<div id="header">
      <div id="topmenu">
               <div id="logo">
                     <img src="img/logo-left.png" alt="BhatkalNews" />
                </div>

                <div id="navigation">
                    <ul>
                        <li>Contact</li>
                        <li>Photo</li>
                        <li>Video</li>
                    </ul>
                 </div>
       </div>
</div>

我使用了reset.css，这是css代码。

/* top-menu */
div#topmenu {
    width:940px;
    margin:0 auto!important;
}
div#logo {
    width:289px;
    padding: 30px 0 0 0;
}

/*navigation */

div#navigation {
    width:446px;
    float:left; 
}

导航div将ul，li放置在徽标下方，而我希望它从徽标后面的左侧对齐。我错过了什么？

Answer 1

您的#logo元素应包含float: left;。我不确定#navigation是否应该具有float样式，但如果您想保留它，则应在div之后添加另一个#navigation元素并使用样式{{1 }}：

clear:both

这应该可以解决问题：）

此致

Answer 2

将float:left添加到#logo - 这将对齐两个元素。

请参阅http://css.maxdesign.com.au/floatutorial/introduction.htm

基本的CSS对齐问题

2 个答案: