content variabel maken

Luc

Beste,

Ik heb momenteel 3 divs, twee van deze divs hebben een vaste waarde (linker menu, rechter menu). Nu wil ik dat de content het resterende vak opvult. Dus afhankelijk van de browser grootte dat de content uitrekt of inkrimpt.

Dit is mij tot heden nog niet gelukt, en zal toch wel fijn zijn als het kon.

Ik heb 2 keer div float left, en een keer float right.

Hopelijk kunnen jullie mij helpen.

De menu's hebben dus altijd een vaste breedte en dan moet de content het middelste vak vullen, zonder dat hij dus die menu's in de weg zit.

Met vriendelijke groet,

Luc

Nick

content 100% maken en de rechter div in de content div doen?

of bedoel je zoiets? http://vgame.webege.com/test.php

Luc

Ja zoiets bedoelde ik. Bedankt

Nick

PHP

<html>
<head>


<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>Naamloos spel</title>
<meta name="keywords" content="" />
<meta name="description" content="" />
<link href="css/ingelogd.css" rel="stylesheet" type="text/css" media="screen" />


</head>


<body>


  <div id="header">
<h1>Header</h1>
  </div>


  <div id="container">
container
  </div>


  <div id="menu-left">
	&nbsp;&nbsp;<a href="#">link</a><br />
	&nbsp;&nbsp;<a href="#">link</a><br />
	&nbsp;&nbsp;<a href="#">link</a><br />
	&nbsp;&nbsp;<a href="#">link</a><br />
	&nbsp;&nbsp;<a href="ingelogd.php?p=uitloggen">Uitloggen</a><br />
<div class="hoofd">
&nbsp;&nbsp;Hoofd
</div>
	&nbsp;&nbsp;<a href="ingelogd.php?p=begin">Startpagina</a><br />
	&nbsp;&nbsp;<a href="ingelogd.php?p=bank">Bank</a><br />
	&nbsp;&nbsp;<a href="ingelogd.php?p=reizen">Reizen</a><br />
	&nbsp;&nbsp;<a href="#">link</a><br />
	&nbsp;&nbsp;<a href="#">link</a><br />
	&nbsp;&nbsp;<a href="#">link</a><br />
	&nbsp;&nbsp;<a href="#">link</a><br />
<div class="hoofd">
&nbsp;&nbsp;Hoofd
</div>
	&nbsp;&nbsp;<a href="#">link</a><br />
	&nbsp;&nbsp;<a href="#">link</a><br />
	&nbsp;&nbsp;<a href="#">link</a><br />
	&nbsp;&nbsp;<a href="#">link</a><br />
	&nbsp;&nbsp;<a href="#">link</a><br />
<div class="hoofd">
&nbsp;&nbsp;Hoofd
</div>
	&nbsp;&nbsp;<a href="#">link</a><br />
	&nbsp;&nbsp;<a href="#">link</a><br />
	&nbsp;&nbsp;<a href="#">link</a><br />
	&nbsp;&nbsp;<a href="#">link</a><br />
	&nbsp;&nbsp;<a href="#">link</a><br />
	&nbsp;&nbsp;<a href="#">link</a><br />
	&nbsp;&nbsp;<a href="#">link</a><br />
<div class="hoofd">
&nbsp;&nbsp;Hoofd
</div>
	&nbsp;&nbsp;<a href="#">link</a><br />
	&nbsp;&nbsp;<a href="#">link</a><br />
	&nbsp;&nbsp;<a href="#">link</a><br />
	&nbsp;&nbsp;<a href="#">link</a><br />
	&nbsp;&nbsp;<a href="#">link</a><br />
	&nbsp;&nbsp;<a href="#">link</a><br />
	&nbsp;&nbsp;<a href="#">link</a><br />
<br /><br />
  </div>


  <div id="menu-right">
	&nbsp;&nbsp;<a href="#">link</a><br />
	&nbsp;&nbsp;<a href="#">link</a><br />
	&nbsp;&nbsp;<a href="#">link</a><br />
	&nbsp;&nbsp;<a href="#">link</a><br />
	&nbsp;&nbsp;<a href="#">link</a><br />
<div class="hoofd">
&nbsp;&nbsp;Hoofd
</div>
	&nbsp;&nbsp;<a href="#">link</a><br />
	&nbsp;&nbsp;<a href="#">link</a><br />
	&nbsp;&nbsp;<a href="#">link</a><br />
	&nbsp;&nbsp;<a href="#">link</a><br />
	&nbsp;&nbsp;<a href="#">link</a><br />
	&nbsp;&nbsp;<a href="#">link</a><br />
	&nbsp;&nbsp;<a href="#">link</a><br />
<div class="hoofd">
&nbsp;&nbsp;Hoofd
</div>
	&nbsp;&nbsp;<a href="#">link</a><br />
	&nbsp;&nbsp;<a href="#">link</a><br />
	&nbsp;&nbsp;<a href="#">link</a><br />
	&nbsp;&nbsp;<a href="#">link</a><br />
	&nbsp;&nbsp;<a href="#">link</a><br />
<div class="hoofd">
&nbsp;&nbsp;Hoofd
</div>
	&nbsp;&nbsp;<a href="#">link</a><br />
	&nbsp;&nbsp;<a href="#">link</a><br />
	&nbsp;&nbsp;<a href="#">link</a><br />
	&nbsp;&nbsp;<a href="#">link</a><br />
	&nbsp;&nbsp;<a href="#">link</a><br />
	&nbsp;&nbsp;<a href="#">link</a><br />
	&nbsp;&nbsp;<a href="#">link</a><br />
<div class="hoofd">
&nbsp;&nbsp;Hoofd
</div>
	&nbsp;&nbsp;<a href="#">link</a><br />
	&nbsp;&nbsp;<a href="#">link</a><br />
	&nbsp;&nbsp;<a href="#">link</a><br />
	&nbsp;&nbsp;<a href="#">link</a><br />
	&nbsp;&nbsp;<a href="#">link</a><br />
	&nbsp;&nbsp;<a href="#">link</a><br />
	&nbsp;&nbsp;<a href="#">link</a><br />
<br /><br />
  </div>


  <div id="content">


content


  </div>
  <div id="footer">
Footer
  </div>


</body>
</html>

Meer tonen

links zou ik wel even leeghalen en in de CSS staan dingen die jij niet nodig hebt denk

PHP

body { 
font: normal 100% Arial, Helvetica, sans-serif; 
background: #696969; 
color: #5D5D5D; 
margin: 0; 
} 


#header{
height: 120px;
width: 100%;
margin: 0;
background: #1D1D1D;
}


#container{
width: 100%;
background: #8B0000;
color: #000000;
text-align: center;
}


#menu-left{
float: left;
width: 250px;
background: #333333;
}


#menu-right{
float: right;
width: 250px;
background: #333333;
}


.hoofd{
background: #8B0000;
color: #000000;
font-family: "arial"; 
font-size: 12pt;
font-weight: bold;
}


#content{
margin: 10px auto;
min-height: 450px;
width: 55%;
color: #000000;
border: 1px solid #8B0000;
}


#footer{
border: 1px solid #000;
width: 100%;
height: 30px;
position: fixed;  
bottom: 0;  
background: #1D1D1D;  
}


a {
color: #000000;
}


a:hover{
color: #1D1D1D;
}

Meer tonen

Luc

Thanks, deze werkt inderdaad

:slotje:

Alex

PHP

<div style="float: left; width: 200px;">Links</div>
<div style="float: left; width: auto; margin-left: 200px;margin-right: 200px; position: absolute;z-index: -10000;">
Midden
</div>
<div style="float: right;  width: 200px;">Rechts</div>

Succes

Edit: had topic niet herladen, mijn fout

Patrick

Closed

ICTscripters

Dé plek voor IT

Dé plek voor IT

Port Father: beta van een browsergame in Antwerpen 1931, feedback welkom

Maffia Hotel: een browsergame waarin je van lobbygast naar spil van het hotel groeit

Crime Club volledig herschreven vanaf nul

Herkent deze Notion-structuurscan echte problemen?

🚀 WE ZOEKEN TESTERS! 🚀

Luchtvaartsoftware: Hoe technologie de moderne luchtvaart verandert

Hoe gebruiken jullie WhatsApp voor marketing en klantopvolging?

[PROJECT] Gamekeuring.nl - Hét onafhankelijke keuringsplatform voor maffiagames & RPG's!

[TE KOOP] Likeboost24.nl: complete SMM-webshop met eigen merk, volautomatische levering en betalen op de eigen pagina

Te koop: TuinKlussen.be, een kant-en-klaar platform voor tuinklussen in Vlaanderen en Brussel

Te koop: Port Father, afgewerkt online maffiaspel in PHP/MySQL, klaar voor de Play Store

content variabel maken

Registratie

Functioneel ontwerp

Access Control List implementatie in PHP/MySQL - deel 1/2

Access Control List implementatie in PHP/MySQL - deel 2/2