0

我正在尝试将菜单对齐到 div 的右侧。就目前而言,菜单位于 div 左上角。我想要它在右上角......我错过了什么?我已经添加了 text-align: 对.... 我试过 float: 对... 我就是无法理解。

<div id="UserPanel">
<div id="menu">
<ul>
<li><a href="default.php">All Apps</a> | </li>
<li><a href="apps.php">My Account</a> | </li>
<li><a href="newsletter.php">Support</a> | </li>
<li><a href="aboutUs.php">Register / Login</a></li>
</ul>
</div>
</div>

CSS代码是

#UserPanel
{
width: 962;
height: 98;
background-image: url('bg-topbar.png');
}
#menu
{
text-align: right;
width: 962;
}
#menu ul /* Remove The Bullets */
{
list-style: none;
padding: 0;
margin: 0;
}
#menu li /* Place list in line */
{
float: left;
margin: 0 0.15em;
}
#menu li a /* Design it */
{
font-size: 0.75em;
background: url(background.gif) bottom left repeat-x;
height: 2em;
line-height: 2em;
float: left;
width: 8em;
display: block;
/* border: 0.1em solid #dcdce9; */
color: #C0C0C0;
text-decoration: none; /* Remove Underline */
text-align: center;
}
4

8 回答 8

3

用这个

#menu {
    float: right;
    text-align: right;
    width: auto;
}

这是jsFiddle 链接

于 2013-09-02T09:44:19.477 回答
1

尝试这个:

#UserPanel
{
width: 962;
height: 98;
background-image: url('bg-topbar.png');
float : right;
}

JSFiddle

于 2013-09-02T09:43:52.923 回答
0

这些都不起作用,但我确实发现 Arif Khan 给了我一个想法。我通过这样做解决了这个问题...

#menu
{
position: relative;
left: 500px;
}
于 2013-09-02T10:31:01.140 回答
0

添加 float:right;到#用户面板

于 2013-09-02T09:43:54.937 回答
0

尝试这个-

#menu
{
position:absolute;
top:0;
right:0;
width: 962;
}
于 2013-09-02T09:44:19.157 回答
0

像这样

演示

CSS

#menu
{
text-align: right;
 float:right;
}
于 2013-09-02T09:46:23.090 回答
0

首先,您没有正确定义宽度和高度属性。我的意思是用 px 或 %; 定义它。例如width:962px;

顺便说一下,这是一个工作示例http://jsfiddle.net/hT4Bd/1/

于 2013-09-02T09:50:33.150 回答
0

如下更新#menu 样式。

#menu
{
text-align: right;
width: 962;
float: right;
}
于 2013-09-02T09:55:15.490 回答