0

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;
}

Edited by chaze: added image

2
Contributors
1
Reply
20
Views
3 Years
Discussion Span
Last Post by hericles
0

Which browser are you using because the 'questions 24/7 support login' section is to the right in Chrome and it looks pretty good...

This topic has been dead for over six months. Start a new discussion instead.
Have something to contribute to this discussion? Please be thoughtful, detailed and courteous, and be sure to adhere to our posting rules.