- Joined
- Jul 26, 2006
- Messages
- 3,634
- Reaction score
- 1,007
index.php
main.css
Don't bother with the looks atm.
EDIT:
So I found out it's a FireFox problem. IE shows it properly. Not sure about Chrome or any others. The DreamWeaver designer shows it properly too (didn't use that to make this, just checked to see).
This is weird because usually the problem is the other way around -> FireFox it runs smooth but issues in IE :S
What did I do wrong?
Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link type="text/css" href="main.css" rel="stylesheet" />
<title>Layout test</title>
</head>
<body>
<div class="wrapper">
<div class="header">
Yoyoyo
</div>
<div class="nav">
Stuff
</div>
<div class="spacer"></div>
<div class="main">
<div class="announcements">
<?php
for($i = 0; $i < 3; $i++)
{
?>
<div class="announcement">
<div class="announcement_title">
Title
</div>
<div class="announcement_content">
Text
</div>
</div>
<div class="spacer"></div>
<?
}
?>
</div>
<div class="ads">
<div class="ad">
<div class="ad_title">
Title
</div>
<div class="ad_content">
Text
</div>
</div>
<div class="ad">
<div class="ad_title">
Title
</div>
<div class="ad_content">
Text
</div>
</div>
</div>
</div>
<div class="spacer"> </div>
</div>
</body>
</html>
main.css
Code:
body {
background: green;
}
.wrapper {
width: 790px;
margin: auto;
}
.header {
width: 273px;
height: 234px;
margin: auto;
border: 1px solid black;
background: lime;
}
.nav {
width: 790px;
height: 31px;
border: 1px solid black;
background: lime;
}
.spacer {
width: 100%;
height: 30px;
}
.main {
width: 790px;
}
.announcements {
float: left;
}
.announcement {
width: 500px;
border: 1px solid white;
}
.announcement_title {
height: 35px;
border: 1px solid black;
background: darkgreen;
}
.announcement_content {
height: 330px;
border: 1px solid black;
background: lime;
}
.ads {
float: right;
}
.ad {
width: 260px;
border: 1px solid white;
}
.ad_title {
width: 260px;
height: 30px;
border: 1px solid black;
background: darkgreen;
}
.ad_content {
width: 260px;
height: 360px;
border: 1px solid black;
background: lime;
}
Don't bother with the looks atm.
EDIT:
So I found out it's a FireFox problem. IE shows it properly. Not sure about Chrome or any others. The DreamWeaver designer shows it properly too (didn't use that to make this, just checked to see).
This is weird because usually the problem is the other way around -> FireFox it runs smooth but issues in IE :S
What did I do wrong?
Last edited: