rambomambo
Gebruiker
- Lid geworden
- 9 dec 2012
- Berichten
- 163
ik zou eindelijk willen als ik mijn browser verklein mijn site mee verkleint.
Als ik dit nu doe gebeurt dit niet en krijg ik dus een overflow in mijn.
Want als ik mijn venster verklein springt mijn rechterkolom schuin onder mijn linkerkolom
wat dus zeker niet de bedoeling is
Als ik dit nu doe gebeurt dit niet en krijg ik dus een overflow in mijn.
Want als ik mijn venster verklein springt mijn rechterkolom schuin onder mijn linkerkolom
wat dus zeker niet de bedoeling is
Code:
* { padding: 0; margin: 0; }
body {
font-family: Arial, Helvetica, sans-serif;
font-size: 13px;
}
#wrapper {
margin: 0 auto;
width: 922px;
}
#header {
width:100%;
float: left;
padding: 10px;
border: 1px solid #ccc;
height: 100px;
margin: 10px 0px 0px 0px;
background: #BD9C8C;
}
#leftcolumn {
color: #333;
border: 1px solid #ccc;
background: #E7DBD5;
margin: 0px 0px 0px 0px;
padding: 10px;
height: 350px;
width:25%;
float: left;
}
#rightcolumn {
float: right;
color: #333;
border: 1px solid #ccc;
background: #F2F2E6;
margin: 0px 0px 0px 0px;
padding: 10px;
height: 350px;
width: 678px;
display: inline;
}
#footer {
width: 900px;
clear: both;
color: #333;
border: 1px solid #ccc;
background: #BD9C8C;
margin: 0px 0px 10px 0px;
padding: 10px;
}
HTML:
<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="utf-8" />
<title></title>
<link href="layout.css" rel="stylesheet">
<link href="uiterlijk.css" rel="stylesheet">
</head>
<!-- Begin Wrapper -->
<div id="wrapper">
<!-- Begin Header -->
<div id="header">
<h1>ContactFormulier</h1>
</div>
<!-- End Header -->
<!-- Begin Left Column -->
<div id="leftcolumn">
Left Column
</div>
<!-- End Left Column -->
<!-- Begin Right Column -->
<div id="rightcolumn">
</div>
<!-- End Right Column -->
<!-- Begin Footer -->
<div id="footer">
This is the Footer
</div>
<!-- End Footer -->
</div>
<!-- End Wrapper -->
</body>
</html>
