Results 1 to 8 of 8

Thread: Colour a hr tag

  1. #1
    Member
    Join Date
    Jun 2011
    Posts
    42
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Colour a hr tag

    Need a little help with a hr tag, I have tried to colour the background but I can't seem to find the right code can anyone help?

  2. #2
    Senior Member Paul Murray's Avatar
    Join Date
    Sep 2010
    Location
    Manchester
    Posts
    902
    Thanks
    9
    Thanked 20 Times in 18 Posts
    I believe it takes it's colour from the 'color' tag.


    hr {
    color:#000;
    }

    You can also use the background color tag too

    hr {
    background-color:#000;
    }

    If it's not changing color it may be inheriting it's color from the somewhere else. Adding !important before the semi colon should override it.

    hr {
    color:#000!important;
    }

  3. #3
    Member
    Join Date
    Jun 2011
    Posts
    42
    Thanks
    0
    Thanked 0 Times in 0 Posts
    What a boob I didn't think of looking in the current CSS, cheers for that I will have a look and see what's what. thanks for the quick response

  4. #4
    Moderator Corrosive's Avatar
    Join Date
    May 2010
    Location
    Bristol, UK
    Posts
    980
    Thanks
    18
    Thanked 27 Times in 20 Posts
    Actually, color will change the text color only. You want to use background-color for that. Also 'color' isn't a tag it is a CSS attribute. It is important not to confuse matters. Tags are HTML.

    Sorry to be a nerd

  5. #5
    Senior Member Paul Murray's Avatar
    Join Date
    Sep 2010
    Location
    Manchester
    Posts
    902
    Thanks
    9
    Thanked 20 Times in 18 Posts
    You know what I mean

  6. #6
    Member
    Join Date
    Jun 2011
    Posts
    42
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by Paul Murray View Post
    You know what I mean
    I knew what you were saying, got that all sorted now thank you, I didn't realise someone had already specified a colour for hr in the css.

  7. #7
    Member
    Join Date
    Oct 2011
    Location
    Liverpool
    Posts
    88
    Thanks
    0
    Thanked 2 Times in 2 Posts
    Quote Originally Posted by Paul Murray View Post

    Adding !important before the semi colon should override it.

    hr {
    color:#000!important;
    }
    Aside: It's usually better to make your css selector's more specific than use !important as it get's to be a bad habit. I'd only use it when overwriting an inline style that some plugin javascript has chucked in.

  8. #8
    Member
    Join Date
    Jun 2011
    Posts
    42
    Thanks
    0
    Thanked 0 Times in 0 Posts
    I don't want to be over writing anything especially when the code is already there, I want to keep everything as simple and as neat as possible

Similar Threads

  1. How is your eye for colour? Take the hue test...
    By Paul Murray in forum Graphic Design Forum:
    Replies: 17
    Last Post: 04-23-2012, 12:20 PM
  2. Can you own a colour? Review please
    By Pigink in forum Website Design Critique:
    Replies: 29
    Last Post: 08-17-2011, 05:31 PM
  3. Colour Shift
    By Cruzini in forum Printing & Print Design Forum:
    Replies: 7
    Last Post: 10-04-2010, 07:09 AM
  4. Printing two of the same colour?
    By blanchard in forum Printing & Print Design Forum:
    Replies: 2
    Last Post: 04-18-2010, 11:03 AM
  5. Colour Blender
    By Boss Hog in forum Website Design Resources:
    Replies: 0
    Last Post: 09-06-2008, 11:49 AM

Posting Permissions

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