Slight Problem, Probably something real stupid. Please have a look.

W

walkclothed

New Member
Hey guys, I'm wondering if someone could have a look at the top navigation bar on the http://www.strokessuck.com and tell me what is creating that visible bit of background that does not change to the hover color when mousing over the "Contact" link. I've been hammering at it for a couple hours and I can't quite figure out what's causing that. Thanks! Also, any other input would be chill.
 
W

wachtn

New Member
It took a minute for me to figure out what you were talking about. The problem is simple to solve.

In screenstyle.css
Code: 
a.nav:link, a.nav:visited {
display:block; float:left; width:19.9%; padding:1.2em 0 1.2em 0; margin:0; 
text-decoration:none; background-color:#6A6A6A; color:#FFFFFF;}

a.nav:hover {
	display:block;
	float:left;
	width:19.9%;
	padding:1.2em 0 1.2em 0;
	margin:0;
	text-decoration:none;
	background-color:#FF0000;
	color:#FFFFFF;

Change 'width: 19.9%' to 'width: 20%'
That should do it but I did not spend enough time to look over the entire source code.
 
W

walkclothed

New Member
Thank you for your reply. That makes perfect sense, but now I remember why I made it 19.9% in the first place. It looks perfect at 20% in firefox, but when I look at it in IE 6 and 7, it drops the Contact button down to the next line. Any idea why it might be doing that? Something with the padding that I'm not seeing?

Thanks!
 
W

wachtn

New Member
Im not really too sure. I dont actually have any first hand experiance with liquid layouts.

Try this, be sure to save a copy of the original CSS file so nothing bad can happen.

Change all relative instances of the code to the commented code.
Code: 
	float:left; // float:left;
	width:19.9%; // width:20%;
	padding:1.2em 0 1.2em 0; // (remove this line)
                                // text-align: center;

Let me know what that does.
 
You must log in or register to reply here.
Top