| Sofia |
07-14-2009 09:38 AM |
Quote:
Originally Posted by mikey1991
(Post 1848437)
Hmmmm.
I used CSS <UL> and <LI> in my simpleblue skin, and that is centered.
@Sofia:
I used this css for my simpleblue menu (Which is centered):
is there any of that code which you could add to your CSS?
@ronald0: don't add above CSS to this skin, it's for sofia.
|
Hi Mikey.
Yes, but you just set a width.
Try this (I don't test it)
Replace all your additional CSS by:
Code:
.center_nomember {
background:url(images/Gutty/gradients/menu.jpg) repeat;
width: 675px;
height: 31px;
margin: 0 auto;
}
.center2 {
background:url(images/Gutty/gradients/menu.jpg) repeat;
height: 31px;
margin: 0 auto;
}
.center {
background:url(images/Gutty/gradients/menu.jpg) repeat;
width: 850px;
height: 31px;
margin: 0 auto;
}
.menu ,.menu ul {
margin: 0px 0px;
padding: 0px;
list-style: none;
height:31px;
font: bold 8pt tahoma, verdana, geneva, lucida, 'lucida grande', arial, helvetica, sans-serif;
}
.menu a {
color: #FFFFFF;
width: 80px;
display: block;
font-weight: normal;
padding: 8px 10px 10px 10px;
text-decoration: none;
font: bold 8pt tahoma, verdana, geneva, lucida, 'lucida grande', arial, helvetica, sans-serif;
border-right: 1px solid #198049;
text-align: center;
}
.menu a:hover {
background:url(images/Gutty/gradients/menuhov.jpg) repeat-x;
color: #FFFFFF;
display: block;
text-decoration: none;
}
.menu li {
float: left;
margin: 0px 0 0px 0;
padding: 0px;
}
.menu li li {
float: left;
margin: 0px 0px 0px 5px;
padding: 0px;
width: 130px;
}
.menu li li a, .menu li li a:link, .menu li li a:visited {
background:url(images/Gutty/gradients/menu.jpg) repeat-x;
width: 150px;
float: none;
margin: 0px;
padding: 4px 10px 0px 10px;
color:#fff;
text-decoration: none;
}
.menu li li a:hover, .menu li li a:active {
background:url(images/Gutty/gradients/menuhov.jpg) repeat-x;
width: 150px;
float: none;
margin: 0px;
padding: 8px 10px 0px 10px;
color: #FFFFFF;
}
.menu li ul {
position: absolute;
width: 10em;
left: -999em;
z-index:1;
}
.menu li:hover ul {
left: auto;
display: block;
}
.menu li:hover ul, .menu li.sfhover ul {
left: auto;
}
I use Gutty, but replace links by the name of your style (Dutty / Tutty / Nutty)
In the header template:
HTML Code:
<!-- NAV BUTTONS -->
<div class="center2" width="100%">
<if condition="$show['member']">
<div class="center" height="31"><else /><div class="center_nomember" height="31"></if>
<div width="100%" class="menu">
<ul>
<if condition="$show['member']">
<li style="border-left: 1px solid #198049;"><a href="usercp.php$session[sessionurl_q]">$vbphrase[user_cp]</a></li>
</if>
<if condition="$show['registerbutton']">
<li style="border-left: 1px solid #198049;"><a href="register.php$session[sessionurl_q]" rel="nofollow">$vbphrase[register]</a></li>
</if>
$template_hook[navbar_buttons_left]
<li><a rel="help" href="faq.php$session[sessionurl_q]" accesskey="5">$vbphrase[faq]</a></li>
<if condition="$show['communitylink'] AND $show['popups']">
<li><a id="community" href="$show[nojs_link]#community" rel="nofollow" accesskey="6">$vbphrase[community]</a><script type="text/javascript"> vbmenu_register("community", true); </script></li>
<else />
<if condition="$show['memberslist']">
<li><a href="memberlist.php$session[sessionurl_q]">$vbphrase[members_list]</a></li>
</if>
<if condition="$show['quick_links_groups']">
<li><a href="group.php?$session[sessionurl]">$vbphrase[social_groups]</a></li>
</if>
</if>
<li><a href="calendar.php$session[sessionurl_q]">$vbphrase[calendar]</a></li>
<if condition="$show['popups']">
<if condition="$show['searchbuttons']">
<if condition="$show['member']">
<li><a href="search.php?$session[sessionurl]do=getnew" accesskey="2">$vbphrase[new_posts_nav]</a></li>
<else />
<li><a href="search.php?$session[sessionurl]do=getdaily" accesskey="2">$vbphrase[todays_posts]</a></li>
</if>
<li><a id="navbar_search" href="search.php$session[sessionurl_q]" accesskey="4" rel="nofollow">$vbphrase[search]</a> <if condition="$show['quicksearch']"><script type="text/javascript"> vbmenu_register("navbar_search", true); </script></if></li>
</if>
<if condition="$show['member']">
<li><a id="usercptools" href="$show[nojs_link]#usercptools" accesskey="3">$vbphrase[quick_links]</a> <script type="text/javascript"> vbmenu_register("usercptools", true); </script></li>
</if>
<else />
<if condition="$show['searchbuttons']">
<li><a href="search.php$session[sessionurl_q]" accesskey="4">$vbphrase[search]</a></li>
<if condition="$show['member']">
<li><a href="search.php?$session[sessionurl]do=getnew" accesskey="2">$vbphrase[new_posts_nav]</a></li>
<else />
<li><a href="search.php?$session[sessionurl]do=getdaily" accesskey="2">$vbphrase[todays_posts]</a></li>
</if>
</if>
<li><a href="forumdisplay.php?$session[sessionurl]do=markread" rel="nofollow">$vbphrase[mark_forums_read]</a></li>
<if condition="$show['member']">
<li><a href="#" onclick="window.open('misc.php?$session[sessionurl]do=buddylist&focus=1','buddylist','statusbar=no,menubar=no,toolbar=no,scrollbars=yes,resizable=yes,width=250,height=300'); return false;">$vbphrase[open_contacts]</a></li>
</if>
</if>
$template_hook[navbar_buttons_right]
<if condition="$show['member']">
<li><a href="login.php?$session[sessionurl]do=logout&logouthash=$bbuserinfo[logouthash]" onclick="return log_out('$vbphrase[sure_you_want_to_log_out]')">$vbphrase[log_out]</a></li>
</if>
</ul>
</div>
</div></div>
<!-- /NAV BUTTONS -->
|
More Information