This is giving me some trouble.. I tried to use the clearfix, but maybe I am doing it wrong. You can see the result in the attachements.
Best regards.
Asbjørn Morell.
PHP 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>
<title>CakePHP : Pages</title>
<link rel="icon" href="/cake/inmedia/favicon.ico" type="image/x-icon" />
<link rel="shortcut icon" href="/cake/inmedia/favicon.ico" type="image/x-icon" />
<link rel="stylesheet" type="text/css" href="/cake/inmedia/css/inmedia.css" /></head>
<body>
<div id="container">
<div id="header">
<div id="logo"></div>
<div id="grey1"></div>
<div id="menu">
<a id="homenav" href="/cake/inmedia/pages/home">FORSIDE</a><div id="menuborder"></div>
<a id="about_usnav" href="/cake/inmedia/pages/about_us">OM OS</a><div id="menuborder"></div>
<a id="skillsnav" href="/cake/inmedia/pages/skills">DET KAN VI</a><div id="menuborder"></div>
<a id="casesnav" href="/cake/inmedia/ccases/view">CASES</a><div id="menuborder"></div>
<a id="contactnav" href="/cake/inmedia/pages/contact">KONTAKT</a><div id="menuborder"></div>
<div class="floatright"><a id="playgroundnav" href="/cake/inmedia/pages/home">PLAYGROUND</a></div>
</div>
<div id="grey2"></div>
<div id="flash"></div>
</div>
<div id="content">
<body id="home">
<div id="rightbox">
<div class="headline">REKLAME.</div>
<div class="box">
<p>Media - <br />
Dit reklamebureau Læn dig bare tilbage og lad os klare din markedsføring.. InMedia er et mindre reklamebureau med fødderne solidt plantet i den jyske muld. Det har givet os næring til, at udvikle kreativ kommunikation med et godt øje for grafisk design og løsninger der virker – vi mister nemlig ikke jordforbindelsen. Engagement, effektivitet og professionel stolthed ligger dybt i os – kort sagt vi er kompetente og til at stole på. Mindre reklamebureau - mindre priser Det behøver ikke at koste en formue.. Det kan være dyrt at benytte et reklamebureau – hos os er prisen overkommelig for alle. Vi er et team af unge mennesker der brænder for det vi laver - så her arbejder vi ikke efter klokken, men bliver ved til vi er tilfredse og deadline er overholdt. Hos os hedder det: Fast pris og fast leveringstid – basta. InMedia er ikke noget stort reklamebureau, så du kommer ikke til at betale for store biler, husleje på strøget og høje direktørlønninger hos os – vi koncentrerer os nemlig om at levere høj kvalitet til lav pris. Det koster ikke noget at spørge - men det betaler sig! Kontakt os og vi vender tilbage inden for 24 timer</p> </div>
</div>
<div id="leftmenu">
<div class="headline">NYHEDER.</div>
<div class="box">
<a href="news/ 15 ">
<h3>2006-09-15 16:57:13</h3>
<p>ÅRHUS UNIVERSITET Tidsskrift for Kunsthistorisk Afdeling InMedia Reklamebureau har ...</a></p><a href="news/ 13 ">
<h3>2006-09-12 19:38:11</h3>
<p>Som du måske har <strong>bemærket </strong>har vi fået nyt ansigt i form af ny ...</a></p> </div>
</div>
<div id="leftbox">
<div class="headline">CASES.</div>
<div class="box">
<img src="/cake/inmedia/files/download/18"/>
<h3>IBM</h3>
<p>Det er en ny måde at drive forretning på - hurtigere, mere effektivt og med fokus på de aktiviteter, der skaber værdi. On demand-virksomheder er gearet til forandring, de kan opfatte og reagere på ændringer i markedet, undgå faldgruber og gribe de muligheder, der viser sig, uden at sænke tempoet eller spilde kræfter på uvæsentlige ting.</p>
<p>2006-09-06 21:14:40</p>
</div>
</div> </div>
</div>
<div id="outer" class="clearfix">
<div id="footer">
InMedia Reklamebureau i Århus - Funch Thomsensgade 10, 1. th - 8200 Århus N - Tlf. 2425 7995 - mail@inmedia.dk
</div>
</div>
</body>
</html>
PHP Code:
/* General Layout */
*
{
list-style: none;
text-decoration: none;
margin: 0;
padding: 0;
font-family: verdana;
font-size: 8pt;
color: #5e5e5e;
}
body, html, #container
{
height: 100%;
border:none;
}
body
{
background-image: url('/cake/inmedia/img/bg.gif');
}
#container
{
display:table;
background-image: url('/cake/inmedia/img/baggrund.jpg');
width:700px;
margin:0px auto;
border-right: 1px solid #C7C8C4;
border-left: 1px solid #C7C8C4;
}
/* Header Stuff */
#header
{
height: 270px;
padding: 0;
}
#logout
{
float: right;
right: 0;
margin: 5px;
color: red;
}
#logo
{
height: 65px;
background-image: url('/cake/inmedia/img/logo.gif');
background-repeat: no-repeat;
margin: 3px 0 0 9px;
}
#menu
{
height: 31px;
background: transparent url('/cake/inmedia/img/header_menu.jpg') repeat-x;
}
#menu a
{
background:url('/cake/inmedia/img/header_menu.jpg') repeat-x;
padding: 7px 18px 7px 18px;
height: 17px;
color: white;
float: left;
}
body#home a#homenav,
body#about_us a#about_usnav,
body#skills a#skillsnav,
body#cases a#casesnav
{
background:url('/cake/inmedia/img/header_menu_active.jpg') repeat-x;
}
#menuborder
{
float: left;
width: 2px;
height: 31px;
background:url('/cake/inmedia/img/header_menu_border.jpg') no-repeat;
}
#grey1
{
height: 9px;
background-image: url('/cake/inmedia/img/grey1.jpg');
background-repeat: no-repeat;
overflow:hidden;
}
#flash
{
height: 148px;
background-image: url('/cake/inmedia/img/flash.jpg');
background-repeat: no-repeat;
border: 1px solid #C7C8C4;
margin: 5px;
}
#grey2
{
height: 10px;
background-image: url('/cake/inmedia/img/grey2.jpg');
background-repeat: no-repeat;
}
/* Content Stuff */
#content
{
padding: 0 5px 25px 5px;
position: relative;
}
/* mac hide \*/
* html #content{height:1%}
/* end hide */
#leftmenu
{
width: 260px;
float: left;
}
#leftbox
{
width: 260px;
float: left;
clear: left;
}
#rightbox
{
width: 410px;
float: right;
}
#rightbox img
{
width: 380px;
}
#content img
{
border: 0;
}
#ccase_extra img
{
width: 128px;
height: 129px;
position: absolute;
right: -9px;
top: 42px;
}
.admin
{
color: red;
display:block;
padding: 0 15px 15px 15px;
}
.headline
{
padding: 0 0 0 20px;
margin: 20px 0 5px 0;
background-color: #C7C8C4;
color: white;
font-size: 10pt;
text-indent: 14px;
}
.box
{
background-color: white;
border: 1px solid #C7C8C4;
}
.box
{
padding: 15px 0 0 0;
}
.box p, img
{
padding: 0 15px 15px 15px;
}
.box h3
{
padding: 0 15px 0px 15px;
}
.floatright
{
float: right;
}
/* Footer Stuff */
#footer
{
text-align: center;
width: 688px;
margin:0px auto;
padding: 5px;
clear:both;
width:700px;
margin:-20px auto;
}
.clearfix:after {
content:".";
display:block;
height:0;
clear:both;
visibility:hidden;
}
.clearfix {
display:inline-block;
}
/* mac hide \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide */
You should be clearing the content div.
Bookmarks