[英]CSS Align Menu to the right of a div
I am trying to align a menu to the right of a div. 我正在尝试将菜单调整到div的右侧。 As it stands the menu is sitting in the div top left.
就目前而言,菜单位于div左上方。 I want it top right... what am I missing?
我想要右上角...我想念什么? I have added text-align: right.... Ive tried float: right... I just can't get it.
我添加了text-align:right ....我尝试过float:right ...我只是听不懂。
<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>
The CSS CODE is CSS CODE是
#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;
}
use this 用这个
#menu {
float: right;
text-align: right;
width: auto;
}
here is the jsFiddle Link 这是jsFiddle链接
Add float:right;
添加
float:right;
to #userpanel 到#userpanel
Try this- 尝试这个-
#menu
{
position:absolute;
top:0;
right:0;
width: 962;
}
First of all you have not defined width and height attribute properly. 首先,您没有正确定义width和height属性。 What i mean is either defined it with px or %;
我的意思是用px或%定义它; eg
width:962px;
例如
width:962px;
By the way here is an working example http://jsfiddle.net/hT4Bd/1/ 顺便说一下,这里是一个工作示例http://jsfiddle.net/hT4Bd/1/
Update #menu styles as follows. 更新#menu样式,如下所示。
#menu
{
text-align: right;
width: 962;
float: right;
}
None of these worked but I did find Arif Khan gave me an idea. 这些都不起作用,但是我确实发现Arif Khan给了我一个主意。 I solved this by doing...
我通过做...解决了这个问题
#menu
{
position: relative;
left: 500px;
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.