Link border and padding in IE not supported?

Discussion in 'CSS' started by Superorb, Aug 16, 2006.

  1. #1
    Any ideas why the a:hover doesn't show up correctly in IE but fine in Fx? Especially the "change text" in the breadcrumbs div where the top/bottom border are cut off. The borders for every link in IE doesn't have the padding. Does IE not support padding of links?

    http://dlis.dos.state.fl.us/_dev/ken/sos/accessibility.htm
     
    Superorb, Aug 16, 2006 IP
  2. kk5st

    kk5st Prominent Member

    Messages:
    3,497
    Likes Received:
    376
    Best Answers:
    29
    Trophy Points:
    335
    #2
    Not tested:

    I had to fix something like this for someone a year or so ago, so memory is hazy. I seem to recall that applying the line-height property with an (experimentally found) arbitrary value solved the problem.

    A couple of notes on the font change links:

    If javascript is disabled, the link breaks. Make the link go to a PHP page with the appropriate argument. That page can check/set a cookie and re-serve itself with the size changed. If javascript is working, the onclick event handler can do its thing without getting the page again.
    
    <a href="http://dlis.dos.state.fl.us/_dev/ken/sos/accessibility.php?size=large" 
       onclick="return !setActiveStyleSheet('Larger Text');" 
       accesskey="a">L<span class="access" title="accesskey=alt a">a</span>rge</a>
    Code (markup):
    Notice I used a span to limn the accesskey. The span is a semantically neutral inline segregator, where the em element says 'talk louder'. The title attribute serves as a reminder tooltip.

    cheers,

    gary
     
    kk5st, Aug 16, 2006 IP
  3. Superorb

    Superorb Peon

    Messages:
    149
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #3
    Well, I don't think we have PHP installed on this server, and if it's not installed it would be a losing battle with the admins. If it's work for them they won't do it. Good idea using the <span> element.

    Adding a line-height didn't help anything. All the links in the page with IE display this problem. Padding-top/bottom works but the left/right padding just doesn't work. It's a shame because everything looks great in Fx but 90% of our users use IE.
     
    Superorb, Aug 17, 2006 IP
  4. AdamSee

    AdamSee Well-Known Member

    Messages:
    422
    Likes Received:
    28
    Best Answers:
    0
    Trophy Points:
    135
    #4
    Looks ok from here. Fixed?
     
    AdamSee, Aug 17, 2006 IP
  5. Superorb

    Superorb Peon

    Messages:
    149
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #5
    Nope. The left and right padding for the hover still doesn't work. I want there to be an equal distance bn the top/bottom padding and the left/right as well.
     
    Superorb, Aug 17, 2006 IP