I cannot for the life of me get this menu to line up tot he right it will only align to the left.
http://webhost.pro/why-us.html
http://webhost.pro/blog/wp-content/uploads//2014/06/wh.jpg
It's the top menu where 24/7 is pulled to the left, I am trying to have it pull to the right. I have added text-align: right; to every part of the CSS for this part and it still will not move.
Sorry I have worked on it for an hour so I thought I would try here before I lose it.
/*** MENU ***/
.sf-menu, .sf-menu * {
margin: 0;
padding: 5;
list-style: none;
}
nav {
float:right;
margin-right:10px;
padding-top:40px;
}
.sf-menu {
line-height: 1.0;
text-align: right;
}
.sf-menu li {
float: left;
position: relative;
margin-left:20px;
}
.sf-menu a {
display: block;
position: relative;
color:#CCCCCC;
text-transform:capitalize;
font-size:12px;
line-height:16px;
}
.sf-menu a:hover,
.sf-menu a.active,
.sf-menu li.sfHover > a {
color:#FFFFFF;
text-decoration:none;
}
.sf-menu ul a:hover,
.sf-menu ul li.sfHover > a {
color:#1f4460;
}
.sf-menu ul ul a:hover,
.sf-menu ul ul li.sfHover > a {
color:#58a5c4;
}
.sf-menu ul {
position: absolute;
top: -999em;
background:url(/images/menu-bg.gif) repeat-x 0 0 #4f95ba;
width: 200px; /* left offset of submenus need to match (see below) */
padding-top: 19px;
padding-right: 0;
padding-bottom: 8px;
padding-left: 0;
}
.sf-menu ul:after {
display:block;
position:absolute;
width:11px;
height:6px;
background:url(../images/marker1.png) no-repeat 0 0;
top:-6px;
left:14px;
content:' ';
}
.sf-menu ul ul:after {
display:block;
position:absolute;
width:5px;
height:9px;
background:url(../images/marker2.png) no-repeat 0 0;
top:13px;
left:-5px;
content:' ';
}
.sf-menu ul ul {
position: absolute;
top: -999em;
padding:10px 0 6px;
background:url(../images/menu-bg1.gif) repeat-x 0 0 #1e4460;
width: 140px; /* left offset of submenus need to match (see below) */
}
.sf-menu ul li {
width: 100%;
margin:0 25 30px;
padding:20px 0 0px;
text-align:left;
}
.sf-menu ul a {
font-size:12px;
color:#fff;
}
.sf-menu li:hover {
visibility: inherit; /* fixes IE7 'sticky bug' */
}
.sf-menu li:hover ul,
.sf-menu li.sfHover ul {
left: -17px;
top: 32px; /* match top ul list item height */
z-index: 99;
}
ul.sf-menu li:hover li ul,
ul.sf-menu li.sfHover li ul {
top: -999em;
}
ul.sf-menu li li:hover ul,
ul.sf-menu li li.sfHover ul {
left: 151px;
top: -8px;
}
ul.sf-menu li li:hover li ul,
ul.sf-menu li li.sfHover li ul {
top: -999em;
}
ul.sf-menu li li li:hover ul,
ul.sf-menu li li li.sfHover ul {
left: 10em; /* match ul width */
top: 0;
}
