CSS Content Boxes - Page 2 - Webmaster Forum - Web Design, Programming and SEO forums

11-14-2005, 10:59 PM

#11

jared

Status: Member
Join date: Sep 2005
Location: Victoria, TX
Expertise:
Software:

Posts: 172

iTrader: 0 / 0%

jared is on a distinguished road

yeah thats not really going to work well. First of all you would see a navy border at the top of the div above the image. Also the header txt wouldnt be aligned properly. I'll see if I can come up with something when I get some time.

11-15-2005, 04:39 AM

#12

bcd

Status: Junior Member
Join date: Oct 2005
Location: Cali
Expertise:
Software:

Posts: 96

iTrader: 0 / 0%

bcd is on a distinguished road

A challenge to all designers out there: create a box like in the picture without nested divs or other messy code

11-15-2005, 03:05 PM

#13

Jhin

Status: Member
Join date: Nov 2005
Location: Ontario, Canada
Expertise:
Software:

Posts: 303

iTrader: 0 / 0%

Jhin is on a distinguished road

Here's my go at it

HTML:

Code:

<div id="News">
<img src="notebook.jpg" align="left"><h1>Test</h1>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit.</p>
</div>

CSS:

Code:

#News{
	background-color: #fff;
	color: #036;
	width: 200px;
	height: 200px; 
}

#News img{
	margin-top: -8px;
}

#News H1{
	margin-top:8px;
	margin-bottom: -20px;
	padding-left: 33px;
	background-color: #036;
	color:#FFF;
	font-size:18px;
	font-family:Arial, Helvetica, sans-serif;
	border-bottom: 1px solid #036;
}
#News P{
	padding: 5px;
	border: 1px solid #036;
}