【发布时间】:2013-07-01 16:44:00
【问题描述】:
如何将此 div 对齐以显示在网页的最右侧:
CSS
/*---- CROSS BROWSER DROPDOWN MENU ----*/
ul#nav {
margin: 0 0 0 200px;
}
ul.drop a {
display:block;
color: #fff;
font-family: Verdana;
font-size: 14px;
text-decoration: none;
}
ul.drop, ul.drop li, ul.drop ul {
list-style: none;
margin: 0;
padding: 0;
border: 1px solid #fff;
background: #555;
color: #fff;
}
ul.drop {
position: relative;
z-index: 597;
float: left;
}
ul.drop li {
float: left;
line-height: 1.3em;
vertical-align: middle;
zoom: 1;
padding: 5px 10px;
}
ul.drop li.hover, ul.drop li:hover {
position: relative;
z-index: 599;
cursor: default;
background: #1e7c9a;
}
ul.drop ul {
visibility: hidden;
position: absolute;
top: 100%;
left: 0;
z-index: 598;
width: 195px;
background: #555;
border: 1px solid #fff;
}
ul.drop ul li {
float: none;
}
ul.drop ul ul {
top: -2px;
left: 100%;
}
ul.drop li:hover > ul {
visibility: visible
}
.style1 {
font-family: calibri;
font-size: 18px;
font-weight: bold;
}
HTML
<p> </p>
<ul class="drop" id="nav" name="nav">
<li><a href='calls.php' class="style1">View Trends</a>
</li>
<!-- <li><a href='calls1.php?id= $date;&id1= $d; ' class="style1">View Trends</a></li>-->
<li><span class="style1">Run Decision Support System</span>
<ul>
<li><span class="style1"><a href="calls.php">Churn Prediction</a></li></span>
<li><span class="style1"><a href="calls.php">Customers Segmentization</a></li></span>
</ul>
<li><a href="#" class="style1">Run Expert System</a>
</li>
我想在我的每个网页上都包含这个导航栏,但希望它出现在页面的右侧......知道怎么做吗?
【问题讨论】:
-
你还应该看看你的html格式,你以某种方式打开标签并以不同的顺序关闭标签,
。现在的浏览器很聪明并且可以容忍错误,但是在 w3c 规则下编写代码始终是一个不错的选择。 validator.w3.org -
使用 jsfiddle 快速格式化您的代码并检测语法错误。它还可以帮助其他人快速弄清楚它的样子 jsfiddle.net/techunter/FUKpU