Jump to content

Need help w/CSS Rollovers


javierdl

Recommended Posts

I'm trying to use this CSS Rollovers tutorial. The problem is that I'm a total rookie on CSS, and I want to use just an image, without the overlaid HTML text. Can someone give me a hand figuring out how the code would look after necessary adjustments?This is what I've done so far: Example 1&Example 2Like I said, I just don't know enough of CSS to figure it out :) ...Thanks in advance guys,JDL

Link to comment
Share on other sites

You were doing fine in your CSS, you just needed a height of 26px. You don't need all that extra code in your CSS like "color" because you can't change the color of the images. Here's the fixed code:

<style type="text/css">#menu a {  display:block;  width: 114px;  height: 26px;  background: url(http://www.javierdl.com/temp/css_rollovers/3in1/signin.png) 0 0 no-repeat;  text-decoration: none;}#menu a:hover {  background-position: -113px 0;}#menu a:active {  background-position: -226px 0;}</style>

<div id="menu"><a href="#"></a></div>
Link to comment
Share on other sites

Thanks for your reply RahXephon : )But it's still not working :) - Have a look at Example 2 again (already updated it). The only thing diff from your code is that I added single quotation marks on each side of the URL and spaces. I did try it without them just as you had it but it didn't work either.J.

Link to comment
Share on other sites

You have 2 starting tags for CSS

 <style type="text/css"><style type="text/css">

You only need one.

 <style type="text/css">

Also, you don't need the period in your code

<div id="menu"><a href="#"></a></div>

Try it.

Link to comment
Share on other sites

Archived

This topic is now archived and is closed to further replies.

×
×
  • Create New...