The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS How to Remove Underline

  • This topic is empty.
Viewing 10 posts - 1 through 10 (of 10 total)
  • Author
  • #42142

    I have an issue. Here is the CodePen. I have an “h1” as the title of my page. I added an underline to “a” and I had to systematically remove it from everything I did not want a underline on. But I can’t seem to figure out how to get rid of it for the “h1.” I used text-decoration: none, but it seems to do nothing. Also, the underline is repeating itself four times over because I have a text-shadow on my “h1” as well. How do I get rid of it? Thank you in advance!


    The problem is that you did not give the underline to the h1 element but instead to the parent a element. So to remove that underline you would have to give the a tag text-decoration:none; not the h1. [Like this](


    But that removes the underline from all links. I want my links to have an underline if they are anything but the header area. How do I accomplish this?


    add this:

    text-decoration: none;


    Thank you muchly, @defogge.


    I am having the exact same problem—being unable to remove a link underline, and have been unable to resolve it with text-decoration: none.

    I’ve also got some weird spacing and inconsistent hover coloring going on as well.

    I am a neophyte and am probably doing something blatantly wrong and am jut to clueless to see it. The link below will show you the css if you don’t mind checking the resources.



    Looks like what uneart mentioned in his reply should work. So targeting the a itself. I’m not seeing any of the other issues you mentioned.

    I’d advise against putting your e-mail address there in plain text by the way, lots of bots around scanning for that. You’ll just end up being on spam lists…


    So are you saying this configuration should work?

    a {
    style=”color: #3EBDA7;
    font-family: lato;
    font-size: 12pt;
    font-style: normal;
    font-weight: 200;
    line-height: 18pt;
    text-align: left;
    text-decoration: none;
    text-shadow: 0px 0px #3EBDA7;

    I am still doing it incorrectly, as nothing has changed.
    Regarding the other issues of color spacing and font size, I have enclosed a sample of what it is supposed to look like in the link so the two can be compared.

    Thank you so much for your help btw!


    In your example these inline-styles are set on the parent td-element, but those styles will only apply to the styles of that td itself: it is not “hitting” the child a element, so browsers-default styles are being applied, hence the underlining. BTW, one doesn’t need a table for such a thing.


    This is extremely helpful, thank you!!

    The only problem I encountered was when trying to rewrite this as an inline style. I am too ignorant to know how to handle some of the more sophisticated coding like multiple classes or id’s. If I am using the correct terminology.

    I have had a very difficult time finding any instruction on anything more than the most simplistic inline styling.

    Here is the link again:

Viewing 10 posts - 1 through 10 (of 10 total)
  • The forum ‘CSS’ is closed to new topics and replies.