Small Navbar problem

Error47 · Feb 27, 2009

Ok, so I installed the bluefox theme and I realized that it has the vertical postbit, so I looked for the GYSN version that had the Horizontal postbit version that I want. But this is what the original theme's navbar looks like

and this is what the GYSN version looks like:

I wan't to use the GYSN version for the theme, but I want the navbar from the first pic. How can I change this?

h@ck3r · Feb 27, 2009

The navbar is supposed to be left aligned.

But if you want it to be central.. copy the code from the navbar template from the old style you had, and paste it into the new style's navbar template.

k_hunter · Feb 27, 2009

Look for this code

Code:

<table  cellpadding="0" cellspacing="0" border="0"  align="left" class="vb_navigation">

Replace with

Code:

<table  cellpadding="0" cellspacing="0" border="0"  align="center" class="vb_navigation">

Error47 · Feb 27, 2009

I copied the code from the old theme to the new one, it still looks the same. Isn't it the one located Navbar / breadcrumb templates > navbar ?

h@ck3r · Feb 27, 2009

Error47 said:
I copied the code from the old theme to the new one, it still looks the same. Isn't it the one located Navbar / breadcrumb templates > navbar ?

Sorry no.

It's the 'header' template.

Error47 · Feb 27, 2009

Great, I am now able to center it but I am now faced with yet another problem. This is what the navbar looks like correct

And this is how my navbar looks like now (note the links)

I already tried copying everything in the header from the working version to the other version, and no luck.

h@ck3r · Feb 27, 2009

I think maybe you need to 'center' something in your css for this skin.

Have a look, o post your css code here and we can have a look.

Error47 · Feb 28, 2009

Where is the CSS code you want me to post? Is there anything I can just copy from the other version that works?

Error47 · Feb 28, 2009

Can anyone help me on this?

h@ck3r · Mar 1, 2009

Go into your admincp and under your bluefox style, select 'Main CSS'.

Scroll down to the very bottom, and in the last box, copy all the code from there and paste it here.

I'm pretty sure what we're looking for should be in here.

Error47 · Mar 1, 2009

Ok here it is

Code:

/* Here you can change the look of the post text and links */

.vb_postbit
{
	color: #848484;
    font: 12px verdana, geneva, lucida, 'lucida grande', arial, helvetica, sans-serif;
	text-decoration: none;
}
.vb_postbit a:link
{
	color: #848484;
        font: 12px verdana, geneva, lucida, 'lucida grande', arial, helvetica, sans-serif;
        border-bottom: 1px dotted #88aace;
	text-decoration: none;
}
.vb_postbit a:visited
{
	color: #848484;
        font: 12px verdana, geneva, lucida, 'lucida grande', arial, helvetica, sans-serif;
        border-bottom: 1px dotted #88aace;
	text-decoration: none;
}
.vb_postbit a:hover, .vb_postbit a:active
{
	color: #88aace;
        font: 12px verdana, geneva, lucida, 'lucida grande', arial, helvetica, sans-serif;
        border-bottom: 1px dotted #848484;
	text-decoration: none;
}


/* ***** Header and Nav  ***** */
.header_bg {
background: #000000 url(images/bluefox/misc/nav_bg.gif) ;
}
.vb_navigation {
background: #000000 url(images/bluefox/misc/nav_bg_small.gif) ;
}

/* ***** navigation roll-overs element */

.css_nav {
float: left;
width: 85px;
height: 34px;
color: #ffffff;
font-family: Tahoma, Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
font-weight: bold;
text-align: center;
margin: 0px;
padding: 0px;
border: 0px;
}

.css_nav a:link , .css_nav a:visited {
display: block;
background-image: url(images/bluefox/misc/nav.gif);
color: #ffffff;
font-family: Tahoma, Verdana, Arial, Helvetica, sans-serif;
font-size: 9px;
font-weight: bold;
line-height: 31px;
text-align: center;
text-decoration: none;
width: 85px;
height: 34px;
}

.css_nav a:hover, .css_nav a:active {
background-image: url(images/bluefox/misc/nav_over.gif);
color: #f4f9ff;
text-decoration: none;
line-height: 33px;
width: 85px;
height: 34px;
}



/* ***** spacers and paddings ***** */

.cat_spacer {
padding:5px 0px 5px 0px;
}
.spacer {
padding:5px 0px 5px 0px;
}
.spacer_small {
padding:2px 0px 2px 0px;
}

/* ***** make announcements, stickies moderated, soft deleted posts, poll posts and search result since last visit pretty ***** */
.announcement {
background-color: #324857;
color: #ffffff;
border-top: 1px solid #3e5a6e;
border-left: 1px solid #3e5a6e;
}
.sticky {
background-color: #363b42;
color: #ffffff;
border-top: 1px solid #4c535f;
border-left: 1px solid #4c535f;
}
.poll {
background-color: #2a2f3b;
color: #ffffff;
border-top: 1px solid #3a4255;
border-left: 1px solid #3a4255;
}
.moderated {
background-color: #3e3e3e;
color: #ffffff;
border-top: 1px solid #4e4e4e;
border-left: 1px solid #4e4e4e;
}
.subscribed {
background-color: #434236;
color: #ffffff;
border-top: 1px solid #4e4e4e;
border-left: 1px solid #4e4e4e;
}
.deleted {
background-color: #282828;
color: #848484;
border-top: 1px solid #363636;
border-left: 1px solid #363636;
}
.last_visit {
background-color: #36393d;
color: #ffffff;
border-top: 1px solid #42464e;
border-left: 1px solid #42464e;
}
.unread {
background-color: #36393d;
color: #ffffff;
border-top: 1px solid #42464e;
border-left: 1px solid #42464e;
}

/* ***** dotted hr ***** */
div.hr {
height: 2px;
background: url(images/bluefox/misc/hr.gif) repeat scroll center;
}
div.hr hr {
display: none;
}

/* ***** make dropdown menu pretty ***** */

.vb_menu_control { 
background: #373737 url(images/bluefox/gradients/gradient_thead.gif) repeat-x top left;
color:  #ffffff;
font: bold 11px tahoma, verdana, geneva, lucida, 'lucida grande', arial, helvetica, sans-serif;
border-top: 1px solid #363636;
padding: 3px 6px 3px 6px;
white-space: nowrap;
}
.vb_menu_control a:link {
color:  #ffffff;
text-decoration: none;
}
.vb_menu_control a:visited {
color:  #ffffff;
text-decoration: none;
}
.vb_menu_control a:hover, .vb_menu_control a:active {
color:  #cdf16c;
text-decoration: underline;
}

/* ***** navbar dot border ***** */
.vb_navbar
{
	background: #1f1f1f;
	color: #848484;
	border: 1px dotted #363636;
}

/* ***** category bottom ***** */
.cat_bottom
{
background: #1f1f1f url(images/bluefox/gradients/gradient_thead.gif) repeat-x top left;
border-top: #363636 1px solid;
}

h@ck3r · Mar 4, 2009

Sorry mate... I've not been online for a few days...

Try this:

HTML:

/* Here you can change the look of the post text and links */

.vb_postbit
{
	color: #848484;
    font: 12px verdana, geneva, lucida, 'lucida grande', arial, helvetica, sans-serif;
	text-decoration: none;
}
.vb_postbit a:link
{
	color: #848484;
        font: 12px verdana, geneva, lucida, 'lucida grande', arial, helvetica, sans-serif;
        border-bottom: 1px dotted #88aace;
	text-decoration: none;
}
.vb_postbit a:visited
{
	color: #848484;
        font: 12px verdana, geneva, lucida, 'lucida grande', arial, helvetica, sans-serif;
        border-bottom: 1px dotted #88aace;
	text-decoration: none;
}
.vb_postbit a:hover, .vb_postbit a:active
{
	color: #88aace;
        font: 12px verdana, geneva, lucida, 'lucida grande', arial, helvetica, sans-serif;
        border-bottom: 1px dotted #848484;
	text-decoration: none;
}


/* ***** Header and Nav  ***** */
.header_bg {
background: #000000 url(images/bluefox/misc/nav_bg.gif) ;
}
.vb_navigation {
background: #000000 url(images/bluefox/misc/nav_bg_small.gif) ;
}

/* ***** navigation roll-overs element */

.css_nav {
float: center;
width: 85px;
height: 34px;
color: #ffffff;
font-family: Tahoma, Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
font-weight: bold;
text-align: center;
margin: 0px;
padding: 0px;
border: 0px;
}

.css_nav a:link , .css_nav a:visited {
display: block;
background-image: url(images/bluefox/misc/nav.gif);
color: #ffffff;
font-family: Tahoma, Verdana, Arial, Helvetica, sans-serif;
font-size: 9px;
font-weight: bold;
line-height: 31px;
text-align: center;
text-decoration: none;
width: 85px;
height: 34px;
}

.css_nav a:hover, .css_nav a:active {
background-image: url(images/bluefox/misc/nav_over.gif);
color: #f4f9ff;
text-decoration: none;
line-height: 33px;
width: 85px;
height: 34px;
}



/* ***** spacers and paddings ***** */

.cat_spacer {
padding:5px 0px 5px 0px;
}
.spacer {
padding:5px 0px 5px 0px;
}
.spacer_small {
padding:2px 0px 2px 0px;
}

/* ***** make announcements, stickies moderated, soft deleted posts, poll posts and search result since last visit pretty ***** */
.announcement {
background-color: #324857;
color: #ffffff;
border-top: 1px solid #3e5a6e;
border-left: 1px solid #3e5a6e;
}
.sticky {
background-color: #363b42;
color: #ffffff;
border-top: 1px solid #4c535f;
border-left: 1px solid #4c535f;
}
.poll {
background-color: #2a2f3b;
color: #ffffff;
border-top: 1px solid #3a4255;
border-left: 1px solid #3a4255;
}
.moderated {
background-color: #3e3e3e;
color: #ffffff;
border-top: 1px solid #4e4e4e;
border-left: 1px solid #4e4e4e;
}
.subscribed {
background-color: #434236;
color: #ffffff;
border-top: 1px solid #4e4e4e;
border-left: 1px solid #4e4e4e;
}
.deleted {
background-color: #282828;
color: #848484;
border-top: 1px solid #363636;
border-left: 1px solid #363636;
}
.last_visit {
background-color: #36393d;
color: #ffffff;
border-top: 1px solid #42464e;
border-left: 1px solid #42464e;
}
.unread {
background-color: #36393d;
color: #ffffff;
border-top: 1px solid #42464e;
border-left: 1px solid #42464e;
}

/* ***** dotted hr ***** */
div.hr {
height: 2px;
background: url(images/bluefox/misc/hr.gif) repeat scroll center;
}
div.hr hr {
display: none;
}

/* ***** make dropdown menu pretty ***** */

.vb_menu_control { 
background: #373737 url(images/bluefox/gradients/gradient_thead.gif) repeat-x top left;
color:  #ffffff;
font: bold 11px tahoma, verdana, geneva, lucida, 'lucida grande', arial, helvetica, sans-serif;
border-top: 1px solid #363636;
padding: 3px 6px 3px 6px;
white-space: nowrap;
}
.vb_menu_control a:link {
color:  #ffffff;
text-decoration: none;
}
.vb_menu_control a:visited {
color:  #ffffff;
text-decoration: none;
}
.vb_menu_control a:hover, .vb_menu_control a:active {
color:  #cdf16c;
text-decoration: underline;
}

/* ***** navbar dot border ***** */
.vb_navbar
{
	background: #1f1f1f;
	color: #848484;
	border: 1px dotted #363636;
}

/* ***** category bottom ***** */
.cat_bottom
{
background: #1f1f1f url(images/bluefox/gradients/gradient_thead.gif) repeat-x top left;
border-top: #363636 1px solid;
}

Error47 · Mar 4, 2009

I don't know what you changed, but it still looks exactly the same.
Another solution to this would be to use the other version with the horizontal postbit, and convert that to the horizontal postbit. That's if we can't fix this.

h@ck3r · Mar 4, 2009

Yes, post the code from both the css and header template from the style with the centered navbar buttons and let me have a look.

Error47 · Mar 4, 2009

I fixed the problem. Anyone else having this problem:

Replace:

Code:

/* ***** navigation roll-overs element */

.css_nav {
float: center;
width: 85px;
height: 34px;
color: #ffffff;
font-family: Tahoma, Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
font-weight: bold;
text-align: center;
margin: 0px;
padding: 0px;
border: 0px;
}

.css_nav a:link , .css_nav a:visited {
display: block;
background-image: url(images/bluefox/misc/nav.gif);
color: #ffffff;
font-family: Tahoma, Verdana, Arial, Helvetica, sans-serif;
font-size: 9px;
font-weight: bold;
line-height: 31px;
text-align: center;
text-decoration: none;
width: 85px;
height: 34px;
}

.css_nav a:hover, .css_nav a:active {
background-image: url(images/bluefox/misc/nav_over.gif);
color: #f4f9ff;
text-decoration: none;
line-height: 33px;
width: 85px;
height: 34px;
}

with:

Code:

/* ***** navigation roll-overs element */

.css_nav {
float: left;
width: 78px;
height: 34px;
color: #ffffff;
font-family: Tahoma, Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
font-weight: bold;
text-align: center;
margin: 0px;
padding: 0px;
border: 0px;
}

.css_nav a:link , .css_nav a:visited {
display: block;
background-image: url(images/bluefox/misc/nav.gif);
color: #ffffff;
font-family: Tahoma, Verdana, Arial, Helvetica, sans-serif;
font-size: 9px;
font-weight: bold;
line-height: 31px;
text-align: center;
text-decoration: none;
width: 78px;
height: 34px;
}

.css_nav a:hover, .css_nav a:active {
background-image: url(images/bluefox/misc/nav_over.gif);
color: #f4f9ff;
text-decoration: none;
line-height: 33px;
width: 78px;
height: 34px;
}

h@ck3r · May 16, 2009

problem solved.

Small Navbar problem

Error47

New Member

h@ck3r

New Member

k_hunter

New Member

Error47

New Member

h@ck3r

New Member

Error47

New Member

h@ck3r

New Member

Error47

New Member

Error47

New Member

h@ck3r

New Member

Error47

New Member

h@ck3r

New Member

Error47

New Member

h@ck3r

New Member

Error47

New Member

h@ck3r

New Member