creating a horizontal colored strip using css

Question

In my webpage I need to put a horizontal colored strip of some width just beneath a Logo text.

I tried to use this css:

#colorstrip{
    width: 100%; height: 2px;
    border-style: solid;
    border-color: white;
}

with this html:

<span id="logo"> My site</span>
<div id="colorstrip"/>

But it shows a white rectangle. How do I make it a filled one? Or do I have to use an image (may be a white square) and put it as background of the div with repeat?

Is using a div for showing this thin bar the correct way? What do you advise?

Answer 1

if you want to fill it, use:

#colorstrip{
    width: 100%; height: 2px;
    border-style: solid;
    border-color: white;
    background-color: white;
}