I can seem to work out how to move the menu over on this website I'm putting together. I want it so the right hand side is flush with the rest of the site.

 

The CSS for the menu is below if someone wouldn't mind taking a look.

 

Thanks.

 

/* -- top menu --*/

 

#topMenu {

position:absolute;

bottom:0;

right:0;

border-top:1px solid #80E1FF;

border-right:1px solid #80E1FF;

/*background:url(images/bk_top_menu.jpg) 0 0 repeat-x;*/

background:url(images/bk_top_menu_ov.jpg) 0 0 repeat-x;

 

}

 

#topMenu ul.sf-menu li {

float:left;

}

 

#topMenu ul.sf-menu li:hover {

 

}

 

#topMenu ul.sf-menu li a{

display:block;

text-transform:uppercase;

color:#B3E3FD;

font-size:13px;

font-weight: bold;

line-height:36px;

border-left:1px solid #54C1FB;

padding:0 17px;

height:36px;

}

 

#topMenu ul.sf-menu li a:hover {

color:#FFF;

text-decoration:none;

/*background:url(images/bk_top_menu_ov.jpg) 0 0 repeat-x;*/

background:url(images/bk_top_menu.jpg) 0 0 repeat-x;

}

 

#topMenu ul.sf-menu li li ul.children {

margin:0 0 0 26px;

}

 

#topMenu ul.sf-menu li li a {

padding:0 12px;

}

 

#topMenu ul.sf-menu li li a:hover {

background:#009FFF;

}

 

#topMenu ul.sf-menu li li {

padding:0;

background:#0082CE;

border-bottom:1px solid #21AEFA;

border-right:1px solid #21AEFA;

}

Edited August 7, 201115 yr by shaneo85

Your top menu with the green background "Home" etc. is on the far right at the moment but if you want it a little away from the right side to line with the image below, edit the right size in style.css:-

#topMenu {
position:absolute; 
bottom:0;
right: 30px;/*0;*/
border-top:1px solid #80E1FF;
border-right:10px solid #80E1FF;
/*background:url(images/bk_top_menu.jpg) 0 0 repeat-x;*/
background:url(images/bk_top_menu_ov.jpg) 0 0 repeat-x;

}

Your top menu with the green background "Home" etc. is on the far right at the moment but if you want it a little away from the right side to line with the image below, edit the right size in style.css:-

#topMenu {
position:absolute; 
bottom:0;
right: 30px;/*0;*/
border-top:1px solid #80E1FF;
border-right:10px solid #80E1FF;
/*background:url(images/bk_top_menu.jpg) 0 0 repeat-x;*/
background:url(images/bk_top_menu_ov.jpg) 0 0 repeat-x;

}

 

Thanks very much, that worked.