-1

I'm trying to change the background color of the <body> which has already been set. How can I override this body background-color and apply a new color to it? The div contained within the body needs to override the body's background color.

Example:

HTML:

<body class="body-class">
    <div class="div-class">

    </div>
</body>

SASS:

body.body-class {
    background-color: setcolor(white);
    .div-class {
        background-color: setcolor(blue);
    }
}

Now I expect the background-color to be blue but it's still white?

Mr Lister
  • 45,515
  • 15
  • 108
  • 150
Exziled
  • 473
  • 5
  • 20

1 Answers1

-2

If the "div-class" div is empty, then the box will be 0px height and only the body background color will be shown.

Is this the case? Or you do have content inside the "div-class" div?

BTW try to use always color codes as is more universal #000 instead of "black" for example. Because if you use the color names you are making the browser responsible of choosing the right color instead of the specific color code.

Ricardo Campos
  • 234
  • 2
  • 7
  • We have this thing called the "standard" that browsers are supposed to adhere to. Browsers don't pick arbitrary colors when they see keywords, they treat them according to the specification. – cimmanon Jan 21 '16 at 20:03
  • You're right but we all know the specifications vary from browser to browser. Maybe the color specification is very well standardized among the different browsers but is always better to use the HEX or RGB code just in case. – Ricardo Campos Jan 21 '16 at 20:08
  • In regards to colors, what you're saying has *never* been true (I've been doing this for over 15 years) – cimmanon Jan 21 '16 at 20:12
  • @RicardoCampos If you just were to remove everything but the first sentence, this would actually have been a good answer. And your comment is patently untrue: there are situations where `black` is recognised, but `rgb(...)` is not. Edge cases, admittedly... – Mr Lister Jan 25 '16 at 22:27