Forums

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

This topic is empty.

Viewing 4 posts - 1 through 4 (of 4 total)

Author

Posts
July 5, 2013 at 8:16 am #46087
clarissa
Member
I am using triple image sprite: top – link, middle – hover, and bottom – highlight current in my main nav, but it doesn’t work for highlight current. My code is:

HTML:
;

CSS:

.wrapLinks ul li {
list-style: none;
}

.wrapLinks ul li a {
text-decoration:none;
}
#home{
background-image:url(home.png);
background-repeat: no-repeat;

}
#products{
background-image:url(products.png);
background-repeat: no-repeat;
}
#sell{
background-image:url(sell.png);
background-repeat: no-repeat;
}
#about{
background-image:url(about.png);
background-repeat: no-repeat;
}

#contact{
background-image:url(contact.png);
background-repeat: no-repeat;
}
a.button {
width:99px;
height:26px;
display:block;
margin-left:-15px;
padding-bottom:3px;
background-position:top;

}
a.button:hover {
background-position: center;
}

a.button:active {
background-position: bottom;
transform: translateY(3px);
}

Everything works fine except:

#1 a#home.button, #2 a#products.button, #3 a#sell.button, #4 a#about.button, #5 a#contact.button{
background-position: bottom;
}

The background is not moving to the bottom position.

I am new to all this so any help would be appreciated.

July 5, 2013 at 9:38 am #141653

PicnicTutorials

Participant

ids arent supposed to be numbers right? I blow at reverse enginering other poeples code. I tried but it would take me 20 minutes to break it down. Here… I very logically coded a 4 part sprite here http://www.websitecodetutorials.com/code/css-nav-menus/css-sprites.php and very logically highlighting a current nav here http://www.websitecodetutorials.com/code/css/highlight-current-page.php. The principal will be the same. Just change the color change to your corridnent change instead.

July 5, 2013 at 9:40 am #141652

Member

>ids arent supposed to be numbers right?

Correct not supposed to start with numbers…or classes AFAIK.

July 5, 2013 at 10:51 am #141672

Member

Thank you for quick answers! I didn’t know that ids shouldn’t be numbers…

I will modify my code.

Viewing 4 posts - 1 through 4 (of 4 total)

The forum ‘CSS’ is closed to new topics and replies.