- This topic is empty.
Viewing 2 posts - 1 through 2 (of 2 total)
Viewing 2 posts - 1 through 2 (of 2 total)
- The forum ‘CSS’ is closed to new topics and replies.
The forums ran from 2008-2020 and are now closed and viewable here as an archive.
I’ve been toying around with CSS Sprites, and have it working just like I want on my homepage.
On my secondary page, however, I’m using the same concept, but the images will not line up like they should. (http://www.usm.edu/pfta/new/index.php/pfta/chair/)
Can anyone take a quick look at my css and help out?
This is what I have for the images:
#side_nav li {
list-style-type:none;
list-style-position: outside;
list-style-image:none;
}
#side_nav li a {
-moz-background-clip:border;
-moz-background-inline-policy:continuous;
-moz-background-origin:padding;
background:transparent url(http://www.usm.edu/coal/new/pfta_webgraphics/side_nav.png) no-repeat scroll 0 0;
display:block;
margin:0;
height:170px;
width:127px;}
#side_nav li a.item1 { background-position: 0 0; }
#side_nav li a:hover.item1:hover { background-position: 0 -137px; }
#side_nav li a.item2 { background-position: 0 -274px; }
#side_nav li a:hover.item2:hover { background-position: 0 -411px; }
#side_nav li a.item3 { background-position: 0 -548px; }
#side_nav li a:hover.item3:hover { background-position: 0 -685px; }
#side_nav li a.item4 { background-position: 0 -822px; }
#side_nav li a:hover.item4:hover { background-position: 0 -959px; }
And here’s my HTML
I don’t see why it works on the homepage (http://www.usm.edu/pfta/new/), but it doesn’t on the other pages…
WOW! I feel like a complete moron…
Thank you so much! I have looked and tried different things…. but never thought to look at the height/width.
THANK YOU! :)