Skip to main content
pfudi
Inspiring
May 7, 2018
Answered

How I can avoid underlining in a list with links?

I have an index in the ePub-file (InDesign> Export> ePub). In the xhtml-file this gives a list (ul - li). Everything is linked, every voice. How I can avoid the underlining that automatically gives me when I insert a link.

In the CSS-file I have” a.link - active - visited - hover” with "text-decoration: none;". The "text-decoration: none;" I have also added by "ul - il", but the text remains underlined.It works only when I don't have links, the text is not underlined..

How can I avoid this?

    This topic is closed to new replies. Start a new post to keep the conversation going.
    Jon Fritz
    Jon FritzCorrect answer
    Community Expert
    May 7, 2018

    Try one of these instead (tack it on to the end of your stylesheet)...

    a:link, a:visited, a:hover, a:active {

         text-decoration:none;

    }

    or the more general...

    a {

         text-decoration:none;

    }

    ...either should automatically remove the underline from all links.

    View reply

    5 replies

    Nancy OShea
    Community Expert
    Nancy OSheaCommunity Expert
    Community Expert
    May 7, 2018

    For reference, see CSS Pseudo-classes CSS Styling Links .

    Translate
    Nancy O'Shea— Product User & Community Expert
    Jon Fritz
    Community Expert
    Jon FritzCommunity ExpertCorrect answer
    Community Expert
    May 7, 2018

    Try one of these instead (tack it on to the end of your stylesheet)...

    a:link, a:visited, a:hover, a:active {

         text-decoration:none;

    }

    or the more general...

    a {

         text-decoration:none;

    }

    ...either should automatically remove the underline from all links.

    Translate
    anissa_thompson
    Community Expert
    anissa_thompsonCommunity Expert
    Community Expert
    May 7, 2018

    From what I can tell, your CSS file is giving an instruction that removes underlines from links only with a class of link; you have added the text-decoration:none; to your unordered list bullet items, but that does not override any links in the bullet items.

    Try adding a class to your list :     ul.special li a { text-decoration:none; }

    or removing the class from the anchor:        ul li a { text-decoration:none; }

    Hope this helps... 

    Translate
    Hope this helps! Make sure to press "✔ Correct Answer" on this post if this answers your question. Happy Creating!Anissa • @anissat
    pfudiAuthor
    Inspiring
    May 7, 2018

    I added before I need help this, but it don't works: "<li class="li-einzug"><a href="../Text/10-Capitolo%202.xhtml#grod">L’incontro con Groddeck</a><br/></li>".

    In this file I don't have anchors. And ul li { text-decoration:none; } I I added itfirst, but it don't works. I don't not why.

    This is the CSS:

    .il-einzug {

        font-family:"Palatino Linotype", serif;

        font-size:1em;

        line-height:1.1;

        text-indent: 30px;

        text-decoration:none;

    }

    Translate
    Terms & ConditionsAccessibility statement
    Using the community Terms of use Privacy Cookie preferences Do not sell or share my personal information ad choicesAdChoices