synkipate
03-04-2006, 02:43 PM
I'm designing a layout for a basic site but am having troubles fixing the size of the box to how I want it.
In firefox, my code works fine for fixing the size, but I'm having troubles setting where the text goes.
In IE, i cannot fix a size to the box at all. I used a spacer image, which had the height I needed, but caused more problems that solving them, so I am stuck
I know I write bad code, as i'm a self-taught designer, but any help would be greatly appreciated :)
http://www.dewaghtkamer.nl/testing/index2.html
Any other code problems you spot, please say!
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>| De Waghtkamer |</title>
<style type="text/css">
body {
margin:0px;
padding:0px;
text-align:center;
}
#logo {
width:750px;
margin:0px auto;
text-align:right;
padding:0px;
background-color:#fff;
}
#CentreImage {
text-align:left;
vertical-align:bottom;
padding:0;
margin:0;
font:Tahoma, Verdana;
font-size:12px;
}
#Content {
width:750px;
height:346;
margin:0px 0px 0px 0px;
text-align:left;
padding-left:15px;
padding-top:0px;
border:1px solid #ccc;
background-color:#fff;
background-image:url(images/verkopen-top.jpg);
background-position:top left;
background-repeat:no-repeat
}
html>body #Content {
height:346px;
font:Tahoma, Verdana;
font-size:12px;
}
p {
font-family: Tahoma, Verdana;
font-size: 12px;
left: 15px;
top: 250px;
}
</style>
</head>
<body>
<div id="logo"><img src="images/header-logo.gif" /><img src="images/header-address.gif" />
<div id="Content"> <p> Hello </p>
</div>
</body>
</html>
In firefox, my code works fine for fixing the size, but I'm having troubles setting where the text goes.
In IE, i cannot fix a size to the box at all. I used a spacer image, which had the height I needed, but caused more problems that solving them, so I am stuck
I know I write bad code, as i'm a self-taught designer, but any help would be greatly appreciated :)
http://www.dewaghtkamer.nl/testing/index2.html
Any other code problems you spot, please say!
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>| De Waghtkamer |</title>
<style type="text/css">
body {
margin:0px;
padding:0px;
text-align:center;
}
#logo {
width:750px;
margin:0px auto;
text-align:right;
padding:0px;
background-color:#fff;
}
#CentreImage {
text-align:left;
vertical-align:bottom;
padding:0;
margin:0;
font:Tahoma, Verdana;
font-size:12px;
}
#Content {
width:750px;
height:346;
margin:0px 0px 0px 0px;
text-align:left;
padding-left:15px;
padding-top:0px;
border:1px solid #ccc;
background-color:#fff;
background-image:url(images/verkopen-top.jpg);
background-position:top left;
background-repeat:no-repeat
}
html>body #Content {
height:346px;
font:Tahoma, Verdana;
font-size:12px;
}
p {
font-family: Tahoma, Verdana;
font-size: 12px;
left: 15px;
top: 250px;
}
</style>
</head>
<body>
<div id="logo"><img src="images/header-logo.gif" /><img src="images/header-address.gif" />
<div id="Content"> <p> Hello </p>
</div>
</body>
</html>