I also have difficulty in Main nav but I try to configure it my self. You request fior the BG is #000000 is not possible. I tried it already. There are to things you can do. :arrow: Make it transparent :arrow: Replace it with your own personal image Main Nav. See this links for further tutorial. [url]http://theftalk.com/t46552-Double-Background-MainNav.html[/url] [url]http://theftalk.com/t29329-New-Mainnav-Code---CSS.html[/url] Your code request :thumbsdown: [spoiler]/* NAVIGATION SECTION */ /* BANNER */ #navigation { background-color: transparent! important; border: none! important; padding-left: 0px; padding-right: 0px; padding-top: 0px; padding-bottom: 0px; background-image: url(YOUR IMAGE BANNER); background-attachment: fixed; background-repeat: no-repeat; background-position: center; width: 0px! important; height: 0px! important;} /* REPLACE OR REMOVE BLUE HORIZONTAL BAR */ #mainnav{ margin: 0px 0px; height: 43px; background: transparent! important; background-image: url(YOUR IMAGE NAVIGATION); background-position: center! important; background-repeat: no-repeat; border-style: none! important; border-color: none! important; border-width: 0px; text-align: center;} /* CENTER MAINNAV */ .primary_links { position:absolute: left: 160px !important; top: 30px! important} /* Hide Classifieds | Jobs | */ .secondary_links { display: none! important;} /* HOME , My Apps , Search */ #mainnav ul li span .noSubMenu a { background-color:transparent! important; padding-right: 0px; color: #66ff00;} /* MY PROFILE , MY CONNECTION , EXPLORE */ #mainnav ul li a { display: inline; margin-right: 0px! important; padding-bottom: 0px; padding-left: 0px; text-decoration: none; color: #66ff00! important; font-size: 12px; line-height: 20px; font-weight: bold; white-space: nowrap;} /* REMOVE BLUE BACKGROUND SUBLINK CONTAINER */ #mainnav ul li ul { display: none;} /* CENTER MAINNAV- IE ONLY */ .primary_links { margin-left: 160px !important; margin-top: 3px;} /* HOVER- PRIMARY LINKS */ #mainnav ul li a:hover { color: #66ff00! important; background-color: transparent! important; background-image: url(YOUR IMAGE BOTTON) ! important; text-decoration: none;} SUBLINK DROP DOWN MENU */ #mainnav ul li ul li a { display: block; padding-top: 1px; padding-right: 0px; padding-bottom: 1px; padding-left: 0px; background-color: transparent! important; background-image: url(YOUR IMAGE BOTTON) ! important; color:#66ff00; border-width:2px; border-style: outset; border-color: #000000; margin: 3px 0 0 0; text-align:center! important;} /* SUBLINK DROP DOWN MENU- Hover */ #mainnav ul li ul li a:hover { color:#66ff00; border-width: 2px; border-style: inset #000000; background-image: url(YOUR IMAGE BOTTON) ! important; background-color:#transparent! important; text-decoration: none;} /* REMOVE BLUE BACKGROUND SUBLINK CONTAINER */ #mainnav ul li ul { left: 0px; position: absolute; top: 20px; display: block; visibility: hidden; padding-top: 5px; padding-right: 5px; padding-bottom: 5px; padding-left: 5px; background-color: transparent! important; width: 150px;} /* REMOVE DOTTED BORDER */ #mainnav ul li ul li { border-width: 0px! important; border-style: none! important; border-color: transparent! important;} /* MESSAGE SETTINGS HELP | LOGOUT */ #subnav a { color:#66ff00! important;} #subnav a:hover { color:#66ff00! important; text-decoration:none;} #navLang span { color:#66ff00! important;} #langSelecter { color:#66ff00! important;}[/spoiler] :arrow: I transparent all the BG. But if you want to the BG to be black with opacity. play with the values indicated. The value I have enter are my default value. :idea: You can put [b]filter: alpha(opacity=___)[/b] .the black part are range 1-100. :idea: :idea: You can apply this where there is BG color or image applied. If you want it transparent too. :idea: :arrow: The Main Nav are centered. :arrow: I also hide some parts. :arrow: I also add your color request to your text. [spoiler]Courtesy to switpotato[/spoiler] For the preview of my work. Just visit my profile. :):thumbsup:

Last edited by vanraid (2008-12-30 00:16:38)