SitePoint Sponsor

User Tag List

Results 1 to 4 of 4

Hybrid View

  1. #1
    SitePoint Enthusiast
    Join Date
    Jan 2013
    Posts
    25
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Underline a link only in one spot

    My .css file has the following:

    Code:
    a {
    	text-decoration:none;
    	color:#b51412;
    }
    I would like to keep it like that so that there is no underlined links on the various parts of the webpage, however, there is just one spot where I would like underlined links. Is there anyway to take the text-decoration:none command away from links in this one area? I'd be happy to do it for each href tag manually since there are only a few of them and I don't know CSS's too well. I am changing a small website that I had a web designer build and I am learning what to do by reverse engineering.

  2. #2
    Gre aus'm Pott gold trophysilver trophybronze trophy
    Pullo's Avatar
    Join Date
    Jun 2007
    Location
    Germany
    Posts
    6,002
    Mentioned
    219 Post(s)
    Tagged
    12 Thread(s)
    Hi,

    If you apply a class to the anchor tag:

    HTML Code:
    <a href="..." class="underline">Link Text</a>
    Then in your css do this:

    Code CSS:
    a.underline{ text-decoration: underline;}
    This will do what you want.

    I would however, think twice before removing the underline from links, as this is a convention that people have got very used to and you might end up confusing your users.

  3. #3
    SitePoint Enthusiast
    Join Date
    Jan 2013
    Posts
    25
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Worked perfectly, thanks!

    The webdesigner setup various methods of making links look like links and I think it works pretty well. However, in this one spot I would like the classic underline.

    I'm curious about something, why are the brackets in the CSS put on different lines by my designer instead of it all just being on one line like you did in your code? I know that I've seen that elsewhere too.

  4. #4
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    40,481
    Mentioned
    182 Post(s)
    Tagged
    6 Thread(s)
    Quote Originally Posted by MechElec View Post

    I'm curious about something, why are the brackets in the CSS put on different lines by my designer instead of it all just being on one line like you did in your code? I know that I've seen that elsewhere too.
    It makes no difference. You can format the code how you want (within reason)

    I usually put one line rules on the same line so that the stylesheet doesn't spread out too much but for more than one line I use this format:

    Code:
    .test{
     color:#fff;
     background:#000;
    }
    Of course you could just do this also:

    Code:
    .test{color:#fff;background:#000}
    The trailing semi colon is optional on the last element. It just means that there is more to follow but its good practice to add it when using multiple rules.


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •