“Light red” and “light green” background colors not working-CSS

programming web dev
1

I’m doing this assignment of The Odin Project. But the two colors aren’t working.

Here’s my code:

index.html:


<p class="odd">Number 1 - I'm a class!</p>

    <div ids="second">Number 2 - I'm one ID.</div>

    <p class="odd oddly-cool">Number 3 - I'm a class, but cooler!</p>

    <div id="four">Number 4 - I'm another ID.</div>

    <p class="odd">Number 5 - I'm a class!</p>

Style.css:


.odd{
    background-color: light red;
    font-family: Verdana, Dejavu Sans, sans-serif;
}
#second{
    color:blue;
    font-size:36px;
}
.oddly-cool{
    font-size:24px;
}
.four{
    background-color: light green;
    font-size:24px;
    font-weight: 700;
}

If I put rgb value, it will work though. So, what’s the issue? Doesnt’ background-color supports light as a value?

2

You can use the named CSS colors, but the names don’t have a space in them. Try lightred and lightgreen as values instead :grinning:

1 Like
3

thank you. lightpink works and lightgreen.

1 Like