Log in

View Full Version : Resolved Making a simple box



nootkan
10-21-2009, 05:26 AM
Forgive my ignorance, but I am new to css and have been looking through posts in this forum for information on how to create a simple bordered box with bordered header within it. I figure I must create a div and format it with a border but how to do it? Any tutorials on how to do this?
Here is an image of what I want to do:
http://www.vanislebc.com/images/smbox.gif

Here's what I've tried but I get a double border between divs.

#boxheader { width: 155px;
background-color:#00a8e1;
border: solid;
color:#000000;
}

#box { width: 155px;
border:solid;
color:#000000;
}

<div id="boxheader"><h1>Content for class "boxheader" Goes Here</h1></div>
<div id="box">Content for class "box" Goes Here</div>
</div>

Got it to work with this:

#boxheader {
width: 155px;
background-color:#00a8e1;
color:#000000;
border-top-width: thin;
border-right-width: thin;
border-bottom-width: thin;
border-left-width: thin;
border-top-style: solid;
border-right-style: solid;
border-bottom-style: solid;
border-left-style: solid;
border-top-color: #000000;
border-right-color: #000000;
border-bottom-color: #000000;
border-left-color: #000000;
}

jerdy
10-22-2009, 07:24 PM
Hey, great to know. Thanks :)