MyBB Community Forums

Full Version: CSS Sprites Problem
You're currently viewing a stripped down version of our content. View the full version with proper formatting.
I am having a problem with CSS sprites. I am trying to create a navbar in the style of apple's. This is my first time using CSS sprites and I have tried to follow all the tutorials correctly. I ended up with something totally different and I don't know why.

Here is the HTML and CSS:
<div id="globalnavbar">
<ul id="navbar">
<li id="navhome"><a href="{$mybb->settings['bburl']}/index.php">Home</a></li>
<li id="navsearch"><a href="{$mybb->settings['bburl']}/search.php">Search</a></li>
<li id="navmemberlist"><a href="{$mybb->settings['bburl']}/memberlist.php">Memberlist</a></li>
<li id="navhelp"><a href="{$mybb->settings['bburl']}/calendar.php">Help</a></li>
<li id="navclendar"><a href="{$mybb->settings['bburl']}/misc.php?action=help">Calendar</a></li>
</ul>
</div>

#globalnavbar #navbar ul {
	list-style: none;
}

#globalnavbar #navbar li {
        display: inline;
}

#globalnavbar #navbar li a {
background-image: url(images/iTunes/navbar.png);
background-repeat: no-repeat;
float: left;
height: 0;
padding-top: 35px;
overflow: hidden;
width: 100px;
}

#globalnavbar #navbar li#navhome {
        background-position: 0 0;
}

#globalnavbar #navbar li#navsearch {
        background-position: -93 0;
}

All I get is this:
[Image: upl6060169769.png]
*bump*

Can anybody help me with this?