Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS Nav Active State Button Re: Nav Active State Button

#60105
deerby
Member

sorry about that apostrophe. I jump the gun on this one. I tried your solution but I was getting the same issue. After scratching my head for a few minutes, I came up with a solution which Worked. I basically Gave each nav button a class name for each individual page and then just apply my css function to get my down state button
See code below:

Code:
#nav{
float : left;
width : 895px;
margin-top : 0px;
margin-left : 0px;
background-color: #fff;
}
#homeBTN {
float : left;
width : 175px;
height : 50px;
text-indent : -9999px;
overflow : hidden;
display : block;
background : transparent url(images/home.jpg) no-repeat 0 0;
}

#homeBTN:hover {
background-position : bottom left;
}

#homeBTN:active {
background-position : bottom left;
}

#nav .home {
background-position: bottom left;
}

#aboutBTN {
float : left;
width : 202px;
height : 50px;
text-indent : -9999px;
overflow : hidden;
display : block;
background : transparent url(images/about.jpg) no-repeat 0 0;
}
#aboutBTN:hover {
background-position : bottom left;
}

#aboutBTN:active {
background-position : bottom left;
}

#nav .about {
background-position: bottom left;
}

this is the website again: http://eclipxeconsulting.com/index.html