Don't get anchors in Chrome or IE8

Posted on 2011-10-20
Last Modified: 2012-05-12
Login with
uid: demo
pwd: demo

In Firefox and IE9, looks exactly like I want (FF-IE9-view.png).
 FF and IE9In Chrome and IE8, looks bad, no anchors showing (Chrome-Problem.png and IE8-Problem.png).
 Chrome Problem IE8 problem
What am I doing wrong?

Question by:EddieShipman
    LVL 11

    Assisted Solution

    This css is causing the issue:

    #rightlinks li a:visited {
    color: black;
    text-indent: -999px; <-- causing the issue

    Open in new window

    The text-indent is forcing it to be rendered to the left off the viewable area page.
    LVL 30

    Expert Comment

    There's a text-indent that the <p> is inheriting. Set the text-indent to 0 on the #rightlinks li p
    LVL 26

    Author Comment

    The text-indent is so the image doesn't have the alt text under it. How do I prevent that and still have the alt-text?
    LVL 30

    Accepted Solution

    Put the text-indent:-9999px; on the #rightlinks li img
    LVL 26

    Author Closing Comment

    I had the text-indent: 0px; assigned to the #rightlinks li p span.

    It now works.

    Write Comment

    Please enter a first name

    Please enter a last name

    We will never share this with anyone.

    Featured Post

    Training Course: Adobe Dreamweaver CC 2015

    Adobe Dreamweaver Creative Cloud is used by web designers and front-end developers and allows you to visualize your site in real-time as you code. This course covers exam objectives for the Adobe Certified Associate (ACA) certification.

    Introduction If you're like most people, you have occasionally made a typographical error when you're entering information into an online form.  And to your consternation, the browser remembers the error, and offers to autocomplete your future entr…
    This article describes how to create custom column layout styles for Bootstrap. The article uses 5 columns to illustrate the concept, but the principle can be extended to any number of columns.
    In this tutorial viewers will learn how to position overlapping items using z-index in CSS. They will also learn the restrictions on the z-index property.  Create a new HTML document with an internal stylesheet.: Create a div in CSS and name it Red.…
    In this tutorial viewers will learn how to embed custom externally-hosted Google Fonts using the Google Font API in CSS Go to the Google Fonts website at Browse or search based on font properties or name to find a suitable font for…

    737 members asked questions and received personalized solutions in the past 7 days.

    Join the community of 500,000 technology professionals and ask your questions.

    Join & Ask a Question

    Need Help in Real-Time?

    Connect with top rated Experts

    19 Experts available now in Live!

    Get 1:1 Help Now