Skip to main content
P
pfudi
Inspiring
May 7, 2018
Answered

How I can avoid underlining in a list with links?

  • May 7, 2018
  • 3 replies
  • 954 views

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 has been closed for replies.
    Correct answer Jon Fritz

    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.

    3 replies

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

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

    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.

    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... 

    Hope this helps! Make sure to press "✔ Correct Answer" on this post if this answers your question. Happy Creating!Anissa • @anissat
    P
    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;

    }

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