当前位置：首页 → 问答吧 → UL无法横向问题，求助

UL无法横向问题，求助

时间：2010-10-10

来源：互联网

我添加了<a>标签后，无法横向显示，怎么改都不行，不知道哪里出错，请高手指点
<div id="nametop">
      <ul>
<li><a href="#">什么问题</a></li>
<li><a href="#">什么问题</a></li>

      </ul>
      </div>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <style type="text/css"> * { margin: 0; padding: 0; } body { font: 12px Georgia, serif; } html { overflow-y: scroll; } a { text-decoration: none; } p { font-size: 15px; margin: 0 0 15px 0; } #page-wrap { width: 1004px; margin: 0px auto; } #topbg{width:1004px; height:126px; background-image:url(../img/topbg.jpg); background-repeat:no-repeat;overflow:hidden} #logo{ background-image:url(../img/logo.jpg); background-repeat:no-repeat; width:163px; height:88px; margin-top:30px;margin-left:100px;} ul { list-style: none;} #organic-tabs ul li a{display:block;} #organic-tabs { padding: 0px; margin: 0 0 15px 0; } #shouye{ width:912px; margin:0 auto; } #left{width:199px; float:left;border:#7BCD09 solid 1px;} #left1{background-image:url(../img/left1.jpg); background-repeat:no-repeat;height:160px; overflow:hidden;} #left ul{margin-left:50px; margin-top:78px; color:#8DD10C; font-size:14px; line-height:26px;} #left2{background-image:url(../img/left2.jpg); background-repeat:no-repeat;height:160px;overflow:hidden;} #left2 ul{ color:#2192BE;} #left3{background-image:url(../img/left3.jpg); background-repeat:no-repeat;height:190px;overflow:hidden;} #left3 ul{color:#259B74;} #middle { width:510px; float:left;margin-left:10px; } #middle1{width:508px; height:180px; border:solid 3px #5ABFDB;} #middle p{ margin-left:30px; margin-top:10px;font-size:20px; font-family:"黑体"; color:#8DD10C; font-weight:bold;} #middle p span{font-size:14px;margin-left:80px; color:#0283B5;} #middle dt{font-size:14px;margin-left:20px; color:#0283B5; width:406px;text-align:left; line-height:20px;} #middle2{ margin-top:5px;width:508px; height:315px; border:solid 3px #5ABFDB;} #newstitle{ margin-left:30px; margin-top:10px;font-size:20px; font-family:"黑体"; color:#8DD10C; font-weight:bold;} #newscontent{ width:500px; margin:0 auto; height:212px; padding-top:10px; color:#CC0000;} #newscontent ul{width:500px;margin:0 auto;padding:8px 0;} #newscontent ul li{width:450px;height:28px;margin:0 auto;list-style-type:none;background:url(../img/line_bg.gif) repeat-x 0px 13px;} #newscontent ul li a {float:left;height:28px;padding:0 5px 0 0;line-height:28px;font-size:14px;color:#0283B5;text-decoration:none;background:#fff;} #newscontent ul li span {float:right;height:28px;padding:0 0 0 5px;line-height:28px;font-size:14px;color:#666;background:#fff;} #right{width:178px; float:right; border:#7BCD09 solid 1px;height:511px;} #youbian{ height:50px; whdth:178px; background:#EDF9E5; background-image:url(../img/lhb.jpg); background-repeat:no-repeat; background-position:center;} #listname ul{height:28px;padding-left:40px; padding-top:20px; line-height:30px;color:#50C104} #listname ul li span{float:left;font-size:14px; padding-right:10px;} #lhb{background:#C5EFDC; float:left; width:906px; margin-left:50px; background-image:url(../img/index_r21_c3.jpg); height:43px;background-repeat:no-repeat; margin-top:10px; margin-bottom:5px;} #nametop{ padding-left:180px; line-height:40px; float:left;} #nametop ul{ color:#13629F; display:inline;} #nametop ul li{ display:inline; margin-left:10px;} #footer{ width:916; height:73px; background-image:url(../img/footer.jpg);margin:0 auto; clear:both; background-repeat:no-repeat; background-position:center; padding-top:10px;} #footer ul{ text-align:center; color:#FFFFFF;} #all-list-wrap{margin-left:50px;width:912px;} #explore-nav { padding-left:100px;overflow: hidden; margin: 0 0 10px 0; background-image:url(../img/daohang.jpg); width:915px;height:40px; } #explore-nav li { width: 97px; float: left; margin: 0 10px 0 0; } #explore-nav li.last { margin-right:0;} #explore-nav li a { padding: 10px; color: white; font-size:18px; font-family:"黑体";text-align: center; border: 0; } #explore-nav li a:hover { background-image:url(../img/index_r5_c12.jpg);} #explore-nav li#ex-shouye a.current, ul#shouye li a:hover { background-image:url(../img/index_r5_c3.jpg);} #explore-nav li#ex-lhb a.current, ul#lhb li a:hover { } #explore-nav li#ptxz a.current, ul#ptxz li a:hover { } #explore-nav li#ex-jfsc a.current, ul#jfsc li a:hover { } #explore-nav li#ex-wyyx a.current, ul#wyyx li a:hover { } #explore-nav li#ex-yhbm a.current, ul#yhbm li a:hover { } </style> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <title>万变游戏托管平台</title> <link rel="stylesheet" type="text/css" href="css/style.css" /> <script language="javascript"> function switchTag(tag,content) { // alert(tag); // alert(content); for(i=1; i <6; i++) { if ("tag"+i==tag) { document.getElementById(tag).getElementsByTagName("a")[0].className="selectli"+i; document.getElementById(tag).getElementsByTagName("a")[0].getElementsByTagName("span") [0].className="selectspan"+i; }else{ document.getElementById("tag"+i).getElementsByTagName("a")[0].className=""; document.getElementById("tag"+i).getElementsByTagName("a")[0].getElementsByTagName("span") [0].className=""; } if ("content"+i==content) { document.getElementById(content).className=""; }else{ document.getElementById("content"+i).className="hidecontent"; } document.getElementById("content").className=content; } } </script> <link href="file:///F|/其伟/css/style.css" rel="stylesheet" type="text/css" /> </head> <body> <div id="page-wrap"> <div id="topbg"> <div id="logo"></div> </div> <div id="organic-tabs"> <ul id="explore-nav"> <li id="ex-shouye"><a href="#" class="current">首页</a></li> <li ><a href="#">龙虎榜</a></li> <li><a href="#">平台下载</a></li> <li ><a href="#">积分商城</a></li> <li ><a href="#">网页游戏</a></li> <li><a href="#">用户帮助</a></li> <li><a href="#">论坛</a></li> </ul> <div id="all-list-wrap"> <div id="shouye"> <div id="left"> <div id="left1"><ul><li>1.平台下载</li><li>2.支持下载</li></ul></div> <div id="left2"><ul><li>1.官方充值</li><li>2.淘宝充值</li></ul></div> <div id="left3"><ul><li>1.下载帮助</li><li>2.安装帮助</li><li>3.注册帮助</li><li>4.使用手册</li></ul></div> </div> <div id="middle"> <div id="middle1"> <p>为什么天山雪水<span>【免责声明】</span></p><dt> 喝薄荷茶是最值得推崇的提神方式，近来被美国《健身》杂志推荐为健康饮品。性味辛凉，主要含有挥发油，油中主要成分为薄荷醇、薄荷脑、薄荷酮、薄荷脂、茨烯、柠檬烯等，具有疏风散热，辟秽解毒的功效。但薄荷可减少产妇的乳汁量，具有一定的刺激性，不宜给哺乳期、怀孕期的女性、小孩使用。</dt></p> </div> <div id="middle2"> <div id="news"> <div id="newstitle"> <span class="span1">平台公告</span> </div> <div id="newscontent"> <ul> <ul> <li><a href="#">9.05版本更新公告 </a><span>2010-10-10</span></li> <li><a href="#">9.05版本更新公告 </a><span>2010-10-10</span></li> <li><a href="#">9.05版本更新公告 </a><span>2010-10-10</span></li> <li><a href="#">9.05版本更新公告 </a><span>2010-10-10</span></li> <li><a href="#">9.05版本更新公告 </a><span>2010-10-10</span></li> <li><a href="#">9.05版本更新公告 </a><span>2010-10-10</span></li> <li><a href="#">9.05版本更新公告 </a><span>2010-10-10</span></li> </ul> </ul> </div> </div> </div> </div> <div id="right"> <div id="youbian"></div> <div id="listname"> <ul> <li><span>1</span>menslong</li> <li><span>1</span>menslong</li> <li><span>1</span>menslong</li> <li><span>1</span>menslong</li> <li><span>1</span>menslong</li> <li><span>1</span>menslong</li> <li><span>1</span>menslong</li> <li><span>1</span>menslong</li> <li><span>1</span>menslong</li> <li><span>1</span>menslong</li> <li><span>1</span>menslong</li> <li><span>1</span>menslong</li> <li><span>1</span>menslong</li> </ul> </div> </div> </div> </div> <div id="lhb"> <div id="nametop"> <ul> <li><a href="#">什么问题</a></li> <li><a href="#">什么问题</a></li> </ul> </div> </div> <div id="footer"> <ul> <li>好的</li> <li>好的</li> <li>好的Email:[email protected]</li> </ul> </div> </div> </body> </html>
提示：您可以先修改部分代码再运行

[ 本帖最后由 youershicun 于 2010-10-10 09:44 编辑 ]

作者: youershicun 发布时间: 2010-10-10

#nametop ul li{ margin-left:10px; float:left;}

将display:inline;改为float:left;

作者: zuwen 发布时间: 2010-10-10