CSS Problem?

unknowndomain

unknowndomain

unknowndomain

Soldato
Joined
18 Apr 2004
Posts
2,613
Location
London
Hey I have to design a website for a college assignment and I have setup div tags to load in the corners to make them curved but suddenley they have stopped working and I dont know why please could you all have a look...

HTML
Code: 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Lifestyle - Advice and information about Gardening, Parenting, Food, DIY and Fashion</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link href="style.css" rel="stylesheet" type="text/css" />
</head>

<body>


<div>

	<div class="header">
		<div class="logo"><a href="index.htm"><img src="images/logo.png" alt="LOGO: Lifestyle (Green)" /></a></div>
		<div class="date"><p class="date">Sunday, 5th February 2006</p></div>
	</div>
	
	<div class="banner">
		<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,40,0" width="680" height="170">
			<param name="movie" value="images/header.swf" /> 
			<param name="quality" value="high" />
			<param name="bgcolor" value="#FFFFFF" />
			<!--[if !IE]> <-->
		<object data="images/header.swf" width="680" height="170" type="application/x-shockwave-flash">
			<param name="quality" value="high" />
			<param name="bgcolor" value="#FFFFFF" />
			<param name="pluginurl" value="http://www.macromedia.com/go/getflashplayer" />
			FAIL (Your browser is not compatable with flash).
		</object>
			<!--> <![endif]-->
		</object>
	</div>
	
	<div class="leftpanel">
		
		<div>
			<div class="tlc"></div>
			<div class="tmf"></div>
			<div class="trc"></div>
		</div>
		
		<div class="cmc">
			<h1>Explore</h1>
			<div class="explore"><a href="/garden"><img src="images/lifestyle_logo_garden_grey.png" alt="LOGO: Lifestyle Garden" /></a></div>
			<div class="explore"><a href="/food"><img src="images/lifestyle_logo_food_grey.png" alt="LOGO: Lifestyle Food" /></a></div>
			<div class="explore"><a href="/fashion"><img src="images/lifestyle_logo_fashion_grey.png" alt="LOGO: Lifestyle Fashion" /></a></div>
			<div class="explore"><a href="/homes"><img src="images/lifestyle_logo_homes_grey.png" alt="LOGO: Lifestyle Homes" /></a></div>
			<div class="explore"><a href="/parent"><img src="images/lifestyle_logo_parent_grey.png" alt="LOGO: Lifestyle Parent" /></a></div>
			<div class="explore"><a href="/talk"><img src="images/lifestyle_logo_talk_grey.png" alt="LOGO: Lifestyle Talk" /></a></div>
		</div>
		
		<div>
			<div class="blc"></div>
			<div class="bmf"></div>
			<div class="brc"></div>
		</div>
		
	</div>
	
	<div class="centerpanel">
	
		<div>
			<div class="tlc"></div>
			<div class="tmf"></div>
			<div class="trc"></div>
		</div>
		
		<div class="cmc">
		
			<h1>Headline</h1>
			<h2>Lorem ipsum elit</h2>
			<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Pellentesque eget est. Integer ultricies placerat massa. Sed condimentum tellus nec tellus.</p>
			<p><a href="article.htm">Read More</a></p>
			
			<h1>Headline</h1>
			<h2>Lorem ipsum elit</h2>
			<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Pellentesque eget est. Integer ultricies placerat massa. Sed condimentum tellus nec tellus.</p>
			<p><a href="article.htm">Read More</a></p>
			
		</div>
		
		<div>
			<div class="blc"></div>
			<div class="bmf"></div>
			<div class="brc"></div>
		</div>
		
	</div>
	
	<div class="rightpanel">
	
		<div>
			<div class="tlc"></div>
			<div class="tmf"></div>
			<div class="trc"></div>
		</div>
		
		<div class="cmc">
			<h1>Search</h1>
			<fieldset>
				<form action="index.htm" method="get">
					<p>
						<input name="search" type="text" size="13" />
						<input type="submit" value="Search" />
					</p>
				</form>
			</fieldset>
			
			<h1>Talk!</h1>
			<ul>
				<li>
				<a href="thread.htm">Thread Title 1#</a></li>
				<li><a href="thread.htm">Thread Title 2#</a></li>
				<li><a href="thread.htm">Thread Title 3#</a></li>
				<li><a href="thread.htm">Thread Title 4#</a></li>
				<li><a href="thread.htm">Thread Title 5#</a></li>
		 	</ul>
		</div>
		
		<div>
			<div class="blc"></div>
			<div class="bmf"></div>
			<div class="brc"></div>
		</div>
		
	</div>

</div>

</body>
</html>

CSS
Code: 
body {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	margin: 0px;
	padding: 0px;
}
div.header {
	position: relative;
	left: 0px;
	top: 0px;
	height: 50px;
	width: 700px;
}
div.logo {
	width: 119px;
	position: relative;
	left: 10px;
	top: 10px;
}
img {
	border: 0px none;
}
div.date {
	position: absolute;
	top: 10px;
	right: 10px;
	text-align: right;
	font-size: 10px;
	width: 200px;
}
div.leftpanel {
	position: absolute;
	width: 220px;
	left: 10px;
	top: 230px;
	background-color: #f0f0f0;
}

div.centerpanel {
	position: absolute;
	width: 220px;
	left: 240px;
	top: 230px;
	background-color: #f0f0f0;
}

div.rightpanel {
	position: absolute;
	width: 220px;
	top: 230px;
	left: 470px;
	background-color: #f0f0f0;
}
div.tlc {
	background-attachment: scroll;
	background-image: url(../images/tlc.png);
	background-repeat: no-repeat;
	background-position: left top;
	position: absolute;
	height: 20px;
	width: 20px;
	left: 0px;
	top: 0px;
}
div.trc {
	background-attachment: scroll;
	background-image: url(../images/trc.png);
	background-repeat: no-repeat;
	background-position: right top;
	position: absolute;
	height: 20px;
	width: 20px;
	top: 0px;
	right: 0px;
}
h1 {
	margin: 0px;
	padding: 0px;
	font-size: 18px;
	font-weight: bold;
}
h2 {
	font-size: 14px;
	margin: 0px;
	padding: 0px 0px 10px;
	font-style: italic;
	font-weight: normal;
}
p {
	font-size: 12px;
	margin: 0px;
	padding: 0px 0px 10px;
}
div.cmc {
	padding: 20px;
}
div.blc {
	background-attachment: scroll;
	background-image: url(../images/blc.png);
	background-repeat: no-repeat;
	background-position: left bottom;
	position: absolute;
	height: 20px;
	width: 20px;
	left: 0px;
	bottom: 0px;
}
div.brc {
	background-attachment: scroll;
	background-image: url(../images/brc.png);
	background-repeat: no-repeat;
	background-position: right bottom;
	position: absolute;
	height: 20px;
	width: 20px;
	right: 0px;
	bottom: 0px;
}
div.banner {
	position: absolute;
	width: 680px;
	left: 10px;
	top: 50px;
	height: 170px;
}
div.explore {
	padding-top: 10px;
}
form {
	margin: 0px;
	padding: 0px;
}
fieldset {
	margin: 0px;
	padding: 0px 0px 10px;
	border: 0px none;
}
input {
	border: 1px dotted #000000;
}
a:link {
	font-style: italic;
	font-weight: normal;
	color: #000000;
	text-decoration: none;
}
a:visited {
	font-style: italic;
	font-weight: normal;
	color: #000000;
	text-decoration: none;
}
a:hover {
	font-style: italic;
	font-weight: normal;
	color: #cccccc;
	text-decoration: none;
}
a:active {
	font-style: italic;
	font-weight: normal;
	color: #000000;
	text-decoration: none;
}
p.date {
	padding-top: 10px;
	padding-right: 0px;
	padding-bottom: 10px;
	padding-left: 0px;
	margin: 0px;
}
ul {
	padding-left: 20px;
}
li {
	margin: 0px;
	padding: 0px;
}
 
You must log in or register to reply here.
Back
Top Bottom