'Invalid property value' in Div background-color

Question

I use one of Bootstrap examples: http://twitter.github.com/bootstrap/examples/fluid.html

The following code is inserted into the navbar-inner div:

    <div class="logo">
        <div class="quadratLogo">&nbsp;</div>
    </div>

Styled as:

    .logo {
      font-size: 24px;
      font-family: 'Arial';
      min-width: 500px;
    }

    .quadratLogo {
        width:24px;
        height:20px;
        border-radius:0px 4px 0px 4px;
        background-color: ff0000;
        float:left;
    }

Can you tell why quadratLogo div is invisible and the background-color property of quadratLogo is seen as unvalid by Chrome?

Answer 1

That's a valid color - but you forgot to include a # symbol before the hex value.

.quadratLogo {
     width:24px;
     height:20px;
     border-radius:0px 4px 0px 4px;
     background-color: #ff0000;
            /* --------^ */
}

Answer 2

Your background-color property is incorrect.

it should be background-color: #ff0000; or set the proper color name

Read more about background-color