SitePoint Sponsor

User Tag List

Results 1 to 4 of 4
  1. #1
    SitePoint Wizard
    Join Date
    Mar 2002
    Location
    Bristol, UK
    Posts
    2,240
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Background override problem

    I'm having a bit of trouble overriding the background on a particular DIV.

    I've added a class="nobg" attribute to the DIV tag, and have put the following style definition in my CSS file:

    .nobg { background:none; }

    However the background still shows in Internet Explorer (not in FF).

    Anyone got any idea why this is happening? I can't provide a URL as it's on a password protected site unfortunately.

    -Sam
    Sam Hastings

  2. #2
    Caveat surfer Buddy Bradley's Avatar
    Join Date
    May 2003
    Location
    Cambridge, UK
    Posts
    2,366
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Specificity.

    You've probably got a more specific declaration in your CSS file that is overriding that one, or appears after that one. Try moving the declaration to the end of the CSS, and maybe add the DIV name to it.

  3. #3
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    40,380
    Mentioned
    180 Post(s)
    Tagged
    6 Thread(s)
    Hi,

    It sounds line a specifity issue. The style that targets the element may be carrying more weight than a simple class and will be over-ridden.

    You will need to drill down to the element to add more weight to it assuming of course that this is the problem. If the div has an id or the parent has and id then use that to add weight to the class.

    e.g.
    Code:
    #parent_id div.nobg {background:none;}
    If all depends whether the original style has even more weight so you may need to drill back a level etc and your class carries more weight than the original.

    If the id is in the same element. e.g.
    Code:
    <div id="coloured_bg" class="nobg">text</div>
    Then you need to target it like so.
    Code:
    #coloured_bg.nobg {background:transparent}
    Without any code to go on I can't give a specific example for your case

  4. #4
    SitePoint Wizard
    Join Date
    Mar 2002
    Location
    Bristol, UK
    Posts
    2,240
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    That worked a treat, Paul.

    I changed my original style to read:

    div#container.nobg { background:none; }

    And everything seemed fine

    -Sam
    Sam Hastings


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
  •