div borders not showing (perhaps just firefirefox)

[tobymather]

Another problem im afraid everyone:

i have been doing a css site and I have made an image as a header, with a navigation bar below it. the html is this:

Code: Select all

<div id="header"><img name="trpctesthead" src="../images/trpc-testhead.jpg" width=100% height="150" border="0" id="trpctesthead" alt="header image" />


<div class="style3" id="navigation">
  <p class="style6">
    <span class="style6"><span class="style7"><a href="#">Home</a> |
    <a href="#">Photo Gallery</a> |
    <a href="#">Applications</a> |
    <a href="#">For Sale/ Wanted</a> |
    <a href="#">Contact Us</a> |
    <a href="#">Links</a> </span>|</span></p>
</div>

and the css is this:

Code: Select all

#header
{
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 150px;
}

#navigation{
    position:absolute;
    background-color:#FFFFFF;
    color:#FFFFFF;
    width:628px;
    height:23px;
    left:10px;
    z-index:2;
    top: 169px;
    border-width:6px;
    border-color:#006633
}

The border is as you can see set to 6px thick in a dark green colour, but it will not show. I use mozilla firefox as my browser, so maybe it shows in others, but is there a way to fix this???


Thanks

[Gwayn]

Hi Toby,
you have to add "border-style:solid;" to make the border appear.
You can set border-style in every style you want but it has to be different than "none" to be visible.

And also... please install the other browsers, at least IE7 and Opera to test the css at least on the most used browsers.

[karinne]

Please use [code]...[/code] tags when displaying code!

Yep ... like Gwayn said, you're missing the border-style property. If all the side have the same style, width and color, you can do this:

Code: Select all

#navigation{
    position:absolute;
    background-color:#FFFFFF;
    color:#FFFFFF;
    width:628px;
    height:23px;
    left:10px;
    z-index:2;
    top: 169px;
    border: 6px solid #006633;
}

Proper CSS shorthand
Efficient CSS with shorthand properties

And yes ... you should have at least IE7 and Opera to test you site in.