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

    Join Date
    Sep 2013
    Posts
    11
    Rep Power
    0

    Remove underline from title


    How do I remove the red underline from under the words 'What is Naive Art This 2 min video explains it all'.
    You have to view the site on a mobile device or using an agent switcher for mobile to see this issue.
    I've tried adding:
    .blog_title a{
    text-decoration: none !important;
    }
    but it isn't working.
    Site is naiverartonline.com (mobile)
    Thanks
  2. #2
  3. No Profile Picture
    Contributing User
    Devshed Novice (500 - 999 posts)

    Join Date
    Oct 2009
    Location
    Nebraska, USA
    Posts
    830
    Rep Power
    275
    looks to me like you need to target h2.field-content a and give that {text-decoration:none;}
    if you just want to target that specific element.

    however, I found this
    Code:
    a:-webkit-any-link {
    color: -webkit-link;
    text-decoration: underline;
    cursor: auto;
    }
    that said it was located in the "user agent stylesheet" and I'm not sure which stylesheet that is pointing to, but, you will see that it is targeting all A "links". I am using Safari's developer tools to change user agent in order to view that site as mobile, so, it may be a part of Safari itself...not sure.
  4. #3
  5. CSS & JS/DOM Adept
    Devshed Supreme Being (6500+ posts)

    Join Date
    Jul 2004
    Location
    USA (verifiably)
    Posts
    20,122
    Rep Power
    4258
    Originally Posted by DonR
    that said it was located in the "user agent stylesheet" and I'm not sure which stylesheet that is pointing to, [...]. I am using Safari's developer tools to change user agent in order to view that site as mobile, so, it may be a part of Safari itself...not sure.
    It's the stylesheet built into each browser that has default styles for elements:

    http://css-class.com/test/css/defaul...t-defaults.htm
    http://www.iecss.com/
    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
    Sep 2013
    Posts
    11
    Rep Power
    0
    I switched round the orders of the classes to
    Code:
    <h2 class="blog_title"><a href="/blog/what-na%C3%AFve-art-2-minute-video-explains-it-all">What is Na´ve Art?  This 2 Minute Video Explains It All</a></h2><a href="/blog/what-na%C3%AFve-art-2-minute-video-explains-it-all">What is Na´ve Art?  This 2 Minute Video Explains It All</a></h2>
    and added a.blog_title{ } and the css worked.
    I still don't understand why it wasn't working originally if there was a div class wrapper directly around the text.
    Code:
    <h2 ...> <a... ><div class="blog_title">What is Naive Art?... </div></h2></a>
    If someone could explain that I would appreciate it.
    Thanks
  8. #5
  9. Contributing User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Apr 2009
    Posts
    310
    Rep Power
    162
    Originally Posted by LucyTech
    I still don't understand why it wasn't working originally if there was a div class wrapper directly around the text.
    Code:
    <h2 ...> <a... ><div class="blog_title">What is Naive Art?... </div></h2></a>
    If someone could explain that I would appreciate it.
    Thanks
    <a> is an inline element and it may only contain inline elements.
    <div> is a block element and is not valid inside an <a>

    If you want to have something wrapped directly around the text in your example, you would have to use <span> tags, not <div> tags.

    Comments on this post

    • DonR agrees
    Quality European Web Hosting - LDHosting.com
    High Quality, Low Cost Web Hosting Services
    www.ldhosting.com
  10. #6
  11. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Sep 2013
    Posts
    11
    Rep Power
    0
    Thanks so much! That was really helpful.

IMN logo majestic logo threadwatch logo seochat tools logo