PietPiraat
Nieuwe gebruiker
- Lid geworden
- 3 feb 2007
- Berichten
- 1
Ik zit met een probleem, namelijk het volgende.
Ik heb een menu gemaakt, in css & html, en wil die nu in 2 vakken splitsen, alleen worden die vakken onder elkaar gezet.
Iemand een oplossing ?
Voorbeeld: http://youngbrains.nl/frank/index.html
En de html
Ik heb een menu gemaakt, in css & html, en wil die nu in 2 vakken splitsen, alleen worden die vakken onder elkaar gezet.
Iemand een oplossing ?
Voorbeeld: http://youngbrains.nl/frank/index.html
HTML:
html {
margin: 0;
padding: 0;
}
body {
background-color: #fff;
}
#main {
float: auto;
position: relative;
width: 960px;
margin:auto;
text-align:left;
padding:0px;
}
#boven {
padding: 0px;
position: relative;
float: auto;
height: 12px;
width: 960px;
background-image:url('plaatjes/boven.gif');
background-repeat: repeat-x;
text-align: center;
}
#linksboven {
padding-left: 0px;
top: 0px;
position: relative;
float: auto;
height: 12px;
width: 960px;
background-image:url('plaatjes/links_boven.gif');
background-repeat: no-repeat;
}
#rechtsboven {
padding-right: 0px;
top: 0px;
position: relative;
float: right;
height: 12px;
width: 12px;
background-image:url('plaatjes/rechts_boven.gif');
background-repeat: no-repeat;
}
#onder {
padding: 0px;
position: relative;
float: auto;
height: 12px;
width: 960px;
background-image:url('plaatjes/onder.gif');
background-repeat: repeat-x;
text-align: center;
}
#linksonder {
padding-left: 0px;
top: 0px;
position: relative;
float: auto;
height: 12px;
width: 960px;
background-image:url('plaatjes/links_onder.gif');
background-repeat: no-repeat;
}
#rechtsonder {
padding-right: 0px;
top: 0px;
position: relative;
float: right;
height: 12px;
width: 12px;
background-image: url('plaatjes/rechts_onder.gif');
background-repeat: no-repeat;
}
#midden {
padding: 0px;
position: relative;
float: auto;
width: 960px;
text-align: center;
background-image: url('plaatjes/midden.gif');
background-repeat: repeat-y;
}
#content {
padding: 5px 10px 5px 10px;
position: relative;
float: auto;
text-align: left;
width: 800px;
}
a.menu {
font-family: Century Gothic;
font-size: 13px;
color: #626262;
font-weight: bold;
line-height: 15pt;
text-decoration: none;
}
a.menu:hover {
font-family: Century Gothic;
font-size: 13px;
color: #fe0dd9;
font-weight: bold;
line-height: 15pt;
}
#menu {
top: 0px;
position: relative;
float: top left;
height: 100px;
width: 240px;
background-color: #cccccc;
display: block;
}
#menu2 {
top: 0px;
position: relative;
float: auto;
right: 0px;
height: 100px;
width: 240px;
background-color: #cccccc;
display: block;
}En de html
HTML:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title> New Document </title>
<meta name="Generator" content="EditPlus">
<meta name="Author" content="">
<meta name="Keywords" content="">
<meta name="Description" content="">
<link type="text/css" rel="stylesheet" href="style.css">
</head>
<body>
<div id='main'>
<div id='boven'><div id='linksboven'><div id='rechtsboven'></div></div></div>
<div id='midden'>
<div id='content'>
<div id='menu'>test</div><div id='menu2'>test</div>
</div>
</div>
<div id='onder'><div id='linksonder'><div id='rechtsonder'></div></div></div>
</div>
</body>
</html>
