...

View Full Version : css nav bar with border problem



tmacka88
11-20-2012, 06:42 AM
Ok. So i am making a nav bar and i am running into a problem with with the :active function. I basically want the border to be 2px rather than 4px and move the whole button down 2px to give it a look as if it is pressed in.

here is the nav bar so far.

http://jsfiddle.net/Xuybs/

I problem im having is with using the border and radius. the only way i can get the border to round out on either side of the bar is to have the border in the #navbar-wrapper. If i put in the the #nav-home a:active the border does not round out.

any help would be great. thanks

Excavator
11-20-2012, 04:11 PM
Hello tmacka88,
A little top margin makes it look like the button is pressed -
#narbar-wrapper ul a:hover {
color: #e8e8e8;
margin-top: 4px;
}

tmacka88
11-20-2012, 11:15 PM
Hello tmacka88,
A little top margin makes it look like the button is pressed -
#narbar-wrapper ul a:hover {
color: #e8e8e8;
margin-top: 4px;
}

Yeh thats works, fine.

The only other problem is I also want it to separate from the top position when clicked also. e.g as if the whole button moved down. like this getactionsapp.com

Excavator
11-20-2012, 11:44 PM
Yeh thats works, fine.

The only other problem is I also want it to separate from the top position when clicked also. e.g as if the whole button moved down. like this getactionsapp.com

I think just changing the background color on active would do that for you...

tmacka88
11-22-2012, 06:00 AM
success! think i have been looking at it too long to pick it up...

thanks



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum