CODEWITHSUNDEEP
htmlcss
PiotrChernin
PiotrChernin

Reputation: 501

Cannot set background color of div

I have this code:

<html>
    <head>
      <title>Document Title</title>
    </head>
    <body>
      <div style="border:1px solid black;"
           style="background-color: green !important;">
        Test Text
      </div>
    </body>
</html>

The border exists as specified. However, the background of the div is not green. Why is the background of the div not green?

I know this is basic, but I've been reading for hours and I can't find an answer anywhere.

Upvotes: 0

Views: 870

Answers (3)

Rahul Gupta
Rahul Gupta

Reputation: 31

You should use only one style in your codding to achieve property of CSS.

here the code:

<!doctype html>
<html>
    <head>
      <title>Document Title</title>
    </head>
    <body>
      <div style="border:1px solid black;background-color: green;">
        Test Text
      </div>
    </body>
</html>

Upvotes: 1

j08691
j08691

Reputation: 208032

You can only have one style attribute per element so the second one is being ignored. Just combine them:

<div style="border:1px solid black;background-color: green !important;">
    Test Text
</div>

jsFiddle example

Upvotes: 0

Niyoko
Niyoko

Reputation: 7672

Use one style attribute. Also, you don't need !important, inline styles always have highest priority.

<div style="border:1px solid black; background-color: green;">
  Test Text
</div>

Upvotes: 1

Related Questions