Navlinks CSS help neded please

[Dave-M]

Hi,

From searching these forums, I believe there is no stylevar for the navlinks left, right and bottom borders. So, I have located the CSS for the navlinks part of the forums, but I'm not quite sure how to go about adding stuff so it work how I want it to do, so if someone could guide me here, I'd be very greatful

I just want a 1px border to follow the rest of the forum's style. I'm using the stock template with colour changes, nothing else.

The code I have is this:

}
#navlinks {
	background: {vb:stylevar navlinks_background};
	_background-image: none;
	border-top: {vb:stylevar navlinks_border_top};
	padding: 6px;
	text-align: center;
	color: {vb:stylevar navlinks_color};
	font-size: 1em;
	clear:both;
}

Thanks

P.S. You know the small drop shadow that is to the left of the boxes on the main forum page? Can I add that to the border too? What is the correct name for that please?

[Dave-M]

Anyone any ideas on this please?

[Qwk86gn]

The place you need to change the CSS is in vbulletin.css

Search for:

.navlinks {

Replace CSS with:

.navlinks {
    background: {vb:stylevar navlinks_background};
    border: {vb:stylevar navlinks_border_top};
    padding: {vb:stylevar padding} 0;
    text-align: center;
    color: {vb:stylevar navlinks_color};
    font-size: {vb:stylevar font-size};
    margin-top: 20px;
    margin-bottom: 20px;
    width:100%;
    clear:both;
    -moz-box-shadow: -2px 2px 2px {vb:stylevar shadow_color};
    -webkit-box-shadow: -2px 2px 2px {vb:stylevar shadow_color};
}

Then use stylevar navlinks_border_top to control the border around the nav links.

Use stylevar shadow_color to set the shadow color around the navlinks.

[Dave-M]

Hi Steve,

Thanks for the reply

Sadly, nothing happens. I already have specified a border colour (in the stylevar) for the top, I have it as 575757, and I'm using the default shadow. With that code, neither the shadow or the border show up.

[Qwk86gn]

Are you looking in the correct template, vbulletin.css?

I tested this prior to posting here and it worked perfectly.

The code you gave above does not change the navlinks like you want. You must edit vbulletin.css template.

[Dave-M]

Yes, see my original post, that code is the original code from vbulletin.css. If I replace yours with mine, nothing happens.

[Dave-M]

I've uploaded a screenshot to show where and how it was added.

[Qwk86gn]

Can I get your web address to check it out?

Do you have anything in your additional.css template?

Are you viewing the correct style when checking to see if it works, "vB4 Default Style"?

[Dave-M]

Thanks Steve, it was me, I must have done something wrong, so I reverted the template and redid it and it worked this time.

Can I just ask, if I want to add the shadow to any future items, is it just a case of adding those two lines to the end of the css for those particular areas?

    -moz-box-shadow: -2px 2px 2px {vb:stylevar shadow_color};
    -webkit-box-shadow: -2px 2px 2px {vb:stylevar shadow_color}

Thanks for your help

[Qwk86gn]

Glad you got it working!

Yes you can use the shadows just about anywhere.