Div's largeurs fixes et variables

Bonjour à tous,


Petit problème du jour à la mise en place d'un site Internet.

Pour commencer voici mon HTML :

<div id="full_size"> 
	<div id="container">
		<div id="header">
			<div id="logo"></div>

				<div id="menu1"></div>
				<div id="menu2"></div>
				<div id="menu3"></div>
				<div id="menu4"></div>

		</div>
		<div id="site">
			<div id="colonne_gauche"></div>
			<div id="contenu">
				<div id="pathway"></div>
				<div id="recherche"></div>
				<div id="article"></div>						
			</div>
		</div>
	</div>
</div>

Mon container doit faire une taille de 90% de la page
- Mon header doit faire 100% de mon container
- Mon logo et mes 4 menus sont sur la même ligne, dans mon header
- Mon logo fait 201px
- Mes menus doivent faire 25% de la taille restante (en gros : 90% de la taille totale - 201px)

Mais en pratique, les menus ne respectent pas la taille de 25% indiquée et n'en font qu'à leur tête
Existe-t-il une méthode pour calculer la taille restante après avoir fixé un div sur la même ligne ?

Merci pour votre aide !
Modifié par bensoltane (06 Aug 2008 - 18:23)

En fait je reformule ma question : quand vous avez un design en 2 colonnes, la 1ère étant de largeur fixe, comment faire pour que la seconde occupe tout l'espace restant ?
Une commande du type "100% - la largeur de la colonne 1" en gros.....

si je mets "auto" sur la deuxième, la largeur va varier selon le contenu...

bensoltane a écrit :
En fait je reformule ma question : quand vous avez un design en 2 colonnes, la 1ère étant de largeur fixe, comment faire pour que la seconde occupe tout l'espace restant ?

En ne définissant pas la largeur de la deuxième colonne (width: auto), en faisant flotter la première (float: left), et en décalant la seconde avec un margin-left: 200px; par exemple.

Ou bien en utilisant un contexte de formatage.

En gros il s'agit de lire, comprendre et appliquer le tutoriel Un design fluide avec trois «colonnes», grâce au positionnement flottant, en supprimant la colonne de droite.

Au fait: quatre DIV pour faire un menu? Tu devrais pouvoir trouver un balisage plus pertinent que ça.

Florent V. a écrit :

En ne définissant pas la largeur de la deuxième colonne (width: auto), en faisant flotter la première (float: left), et en décalant la seconde avec un margin-left: 200px; par exemple.

Ou bien en utilisant un contexte de formatage.

En gros il s'agit de lire, comprendre et appliquer le tutoriel Un design fluide avec trois «colonnes», grâce au positionnement flottant, en supprimant la colonne de droite.

Au fait: quatre DIV pour faire un menu? Tu devrais pouvoir trouver un balisage plus pertinent que ça.

Bonjour et merci pour ta réponse.
Effectivement, tout fonctionne en appliquant ta méthode.
Pour mes 4 DIV de menus, je suis en train de réaliser un template Joomla 1.5, chaque div correspondant à un menu Joomla bien particulier.
En gros, ces 4 DIV sont placés sur la même ligne, et font chacun la même taille (25% de la largeur chacun).

Merci encore pour le coup de main