#1
  1. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Jul 2012
    Posts
    5
    Rep Power
    0

    Links not working in Internet Explorer


    Hi,

    I'm making a website and have been using Chrome and Firefox to check its been working along the way, and I've just viewed it in internet explorer and seen that on my homepage, none of the buttons on the top ("Home", "skills", "Portfolio", "Reviews", "Contact") that are links are working and two other links further down the page have annoying blue borders around them!

    my website is milesmonty.com

    How can I fix this please?

    Thanks
  2. #2
  3. /*
    Devshed Novice (500 - 999 posts)

    Join Date
    Mar 2007
    Location
    Sydney, Australia
    Posts
    729
    Rep Power
    620
    Your anchor tags are being dropped in ie. This is most likely because you are wrapping a div in the anchor tags. Take away the div completely and apply position and size styles to the anchor tag itself. It is OK to have an empty anchor tag.

    Alternatively you could bust out the allinone image and use images inside the anchors. Then you could use alt tags in the images and this would be better for SEO.
    */
  4. #3
  5. CSS & JS/DOM Adept
    Devshed Supreme Being (6500+ posts)

    Join Date
    Jul 2004
    Location
    USA (verifiably)
    Posts
    20,124
    Rep Power
    4304
    Welcome to DevShed Forums, DJ-Specter.

    Originally Posted by benno32
    It is OK to have an empty anchor tag.
    Syntactically, yes, but for usability and accessibility (and SEO) reasons a link should have some text in it (or an image with appropriate "alt text").

    A CSS Image Replacement technique could also be used. I recommend the Gilder/Levin CSS Image Replacement technique.

    Comments on this post

    • benno32 agrees
    • terriwells agrees : Thanks especially for bringing up the SEO point.
    Spreading knowledge, one newbie at a time.

    Check out my blog. | Learn CSS. | PHP includes | X/HTML Validator | CSS validator | Common CSS Mistakes | Common JS Mistakes

    Remember people spend most of their time on other people's sites (so don't violate web design conventions).
  6. #4
  7. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Jul 2012
    Posts
    5
    Rep Power
    0
    Thanks very much for both of these answers!! I've now put a small blank picture in the anchor tags which works brilliantly.

    When I view the page in IE though, I still get annoying borders around the links. Can I do anything about these?

    Thanks again
  8. #5
  9. /*
    Devshed Novice (500 - 999 posts)

    Join Date
    Mar 2007
    Location
    Sydney, Australia
    Posts
    729
    Rep Power
    620
    Originally Posted by DJ-Specter
    Thanks very much for both of these answers!! I've now put a small blank picture in the anchor tags which works brilliantly.

    When I view the page in IE though, I still get annoying borders around the links. Can I do anything about these?

    Thanks again
    I usually add a border attribute to the image tags set to 0. ie:
    html Code:
    <img src="xxx" border="0" />


    But you could do this globally via css as well:

    css Code:
    img { border: none; }
    */
  10. #6
  11. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Jul 2012
    Posts
    5
    Rep Power
    0
    Originally Posted by benno32
    I usually add a border attribute to the image tags set to 0. ie:
    html Code:
    <img src="xxx" border="0" />


    But you could do this globally via css as well:

    css Code:
    img { border: none; }
    The thing is I don't think they're being added by css or anything else, I think its just IE doing something weird to show they're links?
  12. #7
  13. CSS & JS/DOM Adept
    Devshed Supreme Being (6500+ posts)

    Join Date
    Jul 2004
    Location
    USA (verifiably)
    Posts
    20,124
    Rep Power
    4304
    Originally Posted by DJ-Specter
    The thing is I don't think they're being added by css or anything else, I think its just IE doing something weird to show they're links?
    Web browsers use an internal stylesheet to control how elements are displayed by default. Some browsers apply a border to images within a link by default.

    Originally Posted by benno32
    I usually add a border attribute to the image tags set to 0. ie: [code="html"]<img src="xxx" border="0" />[/code]
    But you could do this globally via css as well:
    [code="css"]img { border: none; }[/code]
    The border attribute for <img> elements is obsolete. CSS should be used to control that. FYI, I prefer to use "border: 0 none" instead of just "border: none".

    Comments on this post

    • benno32 agrees : I had better stop using it then. Old habits die hard.
    Spreading knowledge, one newbie at a time.

    Check out my blog. | Learn CSS. | PHP includes | X/HTML Validator | CSS validator | Common CSS Mistakes | Common JS Mistakes

    Remember people spend most of their time on other people's sites (so don't violate web design conventions).

IMN logo majestic logo threadwatch logo seochat tools logo