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

[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

[bogdan]

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

Bogdan
"bogdan" <bo****@nospam.comwrote in message
news:eE*************@TK2MSFTNGP05.phx.gbl...

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