How to float a menu on the right within a div?

B

bogdan

Hi,

I have a div to provide a background image for a menu. I'd like to position
the menu on the right side but I can't seem to find a right way of doing it.
The only way the menu will move to the right if I set text-align=right in
the div. The problem is that menu items are then also aligned on right
side. Not only that but this alignment works only in IE.

Could someone please let me know how to right-align the menu?

Menu:
<div id="menuArea">
<asp:Menu ID="topMenu" runat="server" Orientation="Horizontal"
StaticEnableDefaultPopOutImage="false"
DataSourceID="dsSiteMap">

<StaticMenuItemStyle CssClass="staticMenu" />

</asp:Menu>
<asp:SiteMapDataSource ID="dsSiteMap" runat="server"
ShowStartingNode="False" />
</div>

CSS:
#menuArea
{
background-image: url(Images/header_menu.gif);
background-repeat: no-repeat;
clear: both;
padding-right: 10px;
padding-left: 0%;
font-weight: normal;
font-size: 0.8em;
float: none;
padding-top: 0%;
padding-bottom: 0%;
margin: 0%;
color: #477897;
width: 720;
height: 39px;
/*text-align: right;*/
}

..staticMenu
{
background-color: Transparent;
float: right;
}

Thanks,
Bogdan
 
B

bogdan

I found the problem. I had <StaticMenuItemStyle> placed twice (not shown in
my original post) instead of <StaticMenuStyle> and <StaticMenuItemStyle>. I
thought I'd save some time by copy 'n paste but instead burnt few hours.
Lesson learned.

Bogdan
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Top