SitePoint Sponsor

User Tag List

Results 1 to 11 of 11
  1. #1
    SitePoint Addict
    Join Date
    Jan 2009
    Posts
    368
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Simple Rollover won't work IE

    Hi all

    I have this simple rollover css that uses a image containing the over and out states - hovering over the link move the background.

    http://www.ttmt.org.uk/rollover.html

    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    	"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    
    <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
    <head>
    	<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    	<title>untitled</title>
    	<style type="text/css">
    	   a:link, a:visited;{
    	      height:50px;
    	      width:120px;
    	      display:block;
    	      background:url("nav.gif")no-repeat top left;
    	      text-indent:-1000em;
    	   }
    	   a:hover, a:active;{
    	      background-position:bottom left;
    	   }
    	</style>
    </head>
    
    <body>
    	<a href="#">Button</a>
    </body>
    </html>
    It works in all browsers apart from any IE - the image dosen't show at all. Why dosen't work in IE, and whats the best way to do this.

    Thanks for any help

  2. #2
    SitePoint Wizard bronze trophy PicnicTutorials's Avatar
    Join Date
    Dec 2007
    Location
    Carlsbad, California, United States
    Posts
    3,656
    Mentioned
    15 Post(s)
    Tagged
    0 Thread(s)
    You didn't mention, so I'll assume your talking about IE6. This should fix it... http://www.visibilityinherit.com/cod...ahover-bug.php

  3. #3
    SitePoint Addict
    Join Date
    Jan 2009
    Posts
    368
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanks for the link -

    My original code didn't work in any IE browsers

  4. #4
    SitePoint Wizard bronze trophy PicnicTutorials's Avatar
    Join Date
    Dec 2007
    Location
    Carlsbad, California, United States
    Posts
    3,656
    Mentioned
    15 Post(s)
    Tagged
    0 Thread(s)
    try removing these...

    a:link, a:visited;{
    height:50px;
    width:120px;
    display:block;
    background:url("nav.gif")no-repeat top left;
    text-indent:-1000em;
    }
    a:hover, a:active;{
    background-position:bottom left;
    }

  5. #5
    SitePoint Addict
    Join Date
    Jan 2009
    Posts
    368
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    They were typo's they weren't in the code

  6. #6
    billycundiff{float:left;} silver trophybronze trophy RyanReese's Avatar
    Join Date
    Oct 2008
    Location
    Whiteford, Maryland, United States
    Posts
    13,567
    Mentioned
    6 Post(s)
    Tagged
    0 Thread(s)
    Hi, the problem is that there isn't a space between ) and no-repeat. IE will ignore the rule
    Code:
    background:url("nav.gif")no-repeat top left;
    Add a space there
    Twitter-@Ryan_Reese09
    http://www.ryanreese.us -Always looking for web design/development work

  7. #7
    SitePoint Wizard bronze trophy PicnicTutorials's Avatar
    Join Date
    Dec 2007
    Location
    Carlsbad, California, United States
    Posts
    3,656
    Mentioned
    15 Post(s)
    Tagged
    0 Thread(s)
    This line needs to look like this (add the space)

    background:url(nav.gif) no-repeat top left;

  8. #8
    SitePoint Addict
    Join Date
    Jan 2009
    Posts
    368
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanks RyanReese, working now

  9. #9
    billycundiff{float:left;} silver trophybronze trophy RyanReese's Avatar
    Join Date
    Oct 2008
    Location
    Whiteford, Maryland, United States
    Posts
    13,567
    Mentioned
    6 Post(s)
    Tagged
    0 Thread(s)
    You'rewelcome
    Twitter-@Ryan_Reese09
    http://www.ryanreese.us -Always looking for web design/development work

  10. #10
    SitePoint Wizard bronze trophy PicnicTutorials's Avatar
    Join Date
    Dec 2007
    Location
    Carlsbad, California, United States
    Posts
    3,656
    Mentioned
    15 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by ttmt View Post
    Thanks RyanReese, working now
    Hu-hm - hu-hm - Eric too - P's and Q's man

  11. #11
    SitePoint Addict
    Join Date
    Jan 2009
    Posts
    368
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Sorry, Thank you all - my original thank you must of been posted as you were posting Eric


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •