Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 4 of 4
  1. #1
    Regular Coder
    Join Date
    Jul 2003
    Posts
    601
    Thanks
    17
    Thanked 0 Times in 0 Posts

    How to Override Certain CSS

    Hey All - I have a site that's working fine, but am introducing a new section with a separate CSS file. The original CSS file is also being referenced and this section is blowing up the new stuff I'm working on:

    Code:
    * {
        font-family: "Lucida Grande","Lucida Sans Unicode","Lucida Sans",Verdana,Arial,sans-serif;
        font-size: 11px;
    }
    I can't remove it from the original and I need to override it at the same time. I've tried simply adding inline CSS to tweak the above attributes, but that hasn't been working.

    Is there a good way to do this?

    Thanks in advance.

  • #2
    Master Coder Excavator's Avatar
    Join Date
    Dec 2006
    Location
    Alaska
    Posts
    9,749
    Thanks
    22
    Thanked 1,838 Times in 1,822 Posts
    Hello kraftomatic,
    Putting a font and font-size on everything by using the * doesn't seem like a good idea at all, but if you're stuck with it you just need to be more specific. Specificity can be a little difficult to figure out sometimes but it's the answer to your question.
    Some will suggest the !important property but I don't like using it.

    See this article on the subject.
    Validate often DURING development - Use it like a splelchecker | Debug during Development |Write it for FireFox, ignore IE
    Use the right DocType | Validate your markup | Validate your CSS | Why validating is good | Why tables are bad

  • #3
    Master Coder felgall's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, Australia
    Posts
    6,642
    Thanks
    0
    Thanked 649 Times in 639 Posts
    any reference should be more specific than that one - try specifying the tag name or a class or id and it will override that generic one.
    Stephen
    Learn Modern JavaScript - http://javascriptexample.net/
    Helping others to solve their computer problem at http://www.felgall.com/

    Don't forget to start your JavaScript code with "use strict"; which makes it easier to find errors in your code.

  • #4
    The fat guy next door VIPStephan's Avatar
    Join Date
    Jan 2006
    Location
    Halle (Saale), Germany
    Posts
    8,930
    Thanks
    6
    Thanked 1,041 Times in 1,014 Posts
    You can use the same rule (i. e. * {…}) to override that one, as long as it comes after the original one.


  •  

    Posting Permissions

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