28172 sujets

CSS et mise en forme, CSS3

Melander les % et les px

Pages :
Bonjour a tous,

Voila mon soucis, je suis en train de faire un design extensible en hauteur et en largeur, un problème ce pose quand je faire mon menu. celui ci fait 170px de large il se trouve tout a droite de la page, et mon corps est extensible a gauche du menu, comment faire pour dire que le corps doit faire 100% de l'espace qu'il possède a coté du menu ?

Car peut être que chez moi il prendra 80% et que chez quelqu'un d'autre, avec une autre résolution il prendra 74%.

Merci Smiley smile
Modifié par Mikachu (26 Apr 2010 - 14:56)
Pas de soucis, en faite j'ai trouvé une solution mais je suis pas sur que ce soit la bonne, voici la feuille de style : 


#content{
	width: 100%;
	height: auto;
	position:relative;
}
#menu{
	width:170px;
	height: auto;
	position:absolute;
	right:0;
	top:30px;
	bottom: 30px;
	background:#999;
	padding-left: 1px;
	padding-right: 1px;
	margin-bottom: 50px;
}
#page{
	width: auto;
	height: auto;
	position: absolute;
	top:30px;
	left:50px;
	right: 250px;
}


Mon div #content contient est mon menu et mon texte qui lui est dans le div page.
Ok, alors quelques petites remarques et questions :

• Il n'est pas utile de préciser que #content doit avoir une largeur de 100%, à plus forte raison si c'est un élément de type block (je doute que ce soit un bloc de type inline Smiley lol ), puisqu'il occupera naturellement toute la largeur disponible par rapport à son bloc parent.

• L'intérêt d'un menu n'est-il pas d'être accessible pour faciliter la navigation dans le site ? Si oui, alors pourquoi vouloir le placer tout en bas de la page ?

• Enfin, je ne comprends pas vraiment à quoi est censé ressembler ce fameux menu. Et encore moins pourquoi tu lui as donné une largeur fixe si tu souhaites qu'il prenne toute la largeur disponible (ce qui ne se fera pas naturellement ici, à cause du position: absolute;).

Il existe des manières assez simples et assez censées pour régler ce genre de problèmes, mais elles ne sont pas forcément applicables pour tous les navigateurs. Je pense notamment à la propriété display, qu'il s'agisse de lui donner la valeur table et toutes celles qui y sont associées, ou box (supportée uniquement par les moteurs webkit et bientôt gecko, càd Safari/Chrome et Firefox).

Si tu pouvais fournir un petit schéma, ou un screenshot de ce à quoi ça ressemble pour le moment, je pourrais sans doute t'aider un peu plus.
Ah. Pourtant tu utilises la propriété bottom... C'est ça que je ne comprends pas.

--- édit -----
J'ai peut-être une solution, en fait. Tu places le menu dans le bloc contenant le contenu de ton site. Comme il est positionné de manière absolue, il va se placer par-dessus le texte. Pour régler ce problème tu donnes comme padding-right au bloc container la même valeur que la largeur du menu.
Par contre, le bloc container ne doit pas être positionné de manière absolue, lui, sinon ça ne marche pas (et ça ne devrait de toute manière pas être nécessaire Smiley cligne ).
Modifié par phpdoesnotcare (25 Apr 2010 - 19:42)
Ben la c'est bon ça marche niquel, en faite l'attribu bottom na rien a faire la comme tu dit, je l'ai enlevé, par contre mon footer se retrouve au dessus du content Oo même en mettant clear both il est tout en haut sous le content flash Oo .
Tu as bien pensé à positionner le contenu de manière statique, et non absolue (sinon : sortie de flux, etc., ce qui fait que ta page agit comme s'il n'y avait pas de contenu du tout) ?
Hello,

Déjà, le positionnement absolu me semble à la fois inutile et potentiellement problématique. Inutile car on peut faire autrement, et potentiellement problématique car si tout le contenu de #content est positionné en absolu, #content va se retrouver avec une hauteur nulle (ou en tout cas ne dépendant plus de son contenu, qui est hors flux car positionné en absolu).

Pour faire un design à deux colonnes, avec une colonne de droite de largeur fixe et une colonne de gauche qui s'adapte à l'espace disponible, il y a plusieurs méthodes, qui vont être plus ou moins adaptées suivant ce qu'on veut faire exactement niveau design (autres contraintes du genre adaptation à la hauteur du contenu, colonnes de même hauteur, etc.).

Classiquement, on va pouvoir utiliser la propriété float:
#content {
  overflow: hidden; /* Empêche le dépassement des flottants */
}
#menu {
  float: right;
  width: 170px;
  margin-left: 20px;
}
#page {
  overflow: hidden; /* Fait que le bloc est repoussé par le flottant à droite */
}

Deux contraintes ici:
1. #menu devra être placé avant #page dans le code HTML.
2. L'utilisation de overflow:hidden pour créer un contexte de formatage, que ce soit sur #page ou sur #content, peut poser problème si on a prévu de faire dépasser des éléments du contenu des limites de ces conteneurs.

La solution moderne serait d'imiter le comportement des cellules de tableau:
#content {
  display: table;
  width: 100%;
}
#page {
  display: table-cell;
}
#menu {
  display: table-cell;
  width: 170px;
  padding-left: 20px;
}

Inconvénients:
1. Les contenus trop larges font exploser la largeur des cellules et in fine du «tableau» (#content).
2. Supporté par tous les navigateurs récents, mais pas par le vieux IE7.
À noter que l'on peut, bien entendu, reproduire la même mise en page avec un tableau de mise en page (deux cellules).

Il peut y avoir d'autres solutions, notamment une utilisation plus modérée du positionnement absolu (menu positionné en absolu, #page en position:static avec un margin-right: 170px par exemple), mais ça va dépendre du design et de ses contraintes.

phpdoesnotcare a écrit :
Ah. Pourtant tu utilises la propriété bottom... C'est ça que je ne comprends pas.

Positionnement absolu en utilisant à la fois bottom et top, ou à la fois left et right: ça permet de dimensionner l'élément en fonction des limites du plus proche élément positionné.
Réviser le positionnement absolu en CSS 2.1 si nécessaire. Smiley cligne
bonsoir ,

je te propose de voir un gabarit sur une structure classique et des styles gardant les elements dans le flux.
1) avec un css classique basique
2) avec des bidouilles inutiles obligeant a des surcharges et fragilisant la mise en forme ...


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr">
<head>
<title>test gabarit simple (gcyrillus)</title>
<style type='text/css'>
body {min-width:800px;}
/*classique */

.gauche {float:left;width:170px;}
.droite , .content {overflow:hidden;zoom:1;}/* gestion des flottants IE6 + nav plus ou moins recents */

/*bidouille */
#content {padding-left:170px;}/* libere un espace de largeur fixe*/
#gauche  {float:left;width:170px;/* css classique */
margin-left:-170px;position:relative;z-index:1;/* force le deplacement vers la gauche et positionne assurement au dessus des autres elements  */}
#droite , #content {overflow:hidden;zoom:1;}/* gestion des flottants IE6 + nav plus ou moins recents */
#pied {clear:both;}/* facultatif dans cette exemple */

/* couleurs de fonds */
#global , .global{background:yellow;}
#content , .content , h1 , #pied , .pied{background:#777;}
#gauche , .gauche  {background:#ccc;min-height:250px;}
#droite , .droite  {background:#aaa;}
</style>
</head>
<body>
	<div class="global">
	 <h1>classique</h1>
	 <div class="content">
	   <div class="gauche">
			 <p>a gauche</p> 
	   </div>
	   <div class="droite">
			 <p>a droite</p> 
	   </div>
	 </div>
	 <div class="pied"> 
	   <p>pied</p>
	 </div>
	</div>

	<div id="global">
	 <h1>ou bidouille , si c'est trop simple [cligne] et qui marche encore pas trop mal ...</h1>
	 <div id="content">
	   <div id="gauche">
			 <p>a gauche</p> 
	   </div>
	   <div id="droite">
			 <p>a droite</p> 
	   </div>
	 </div>
	 <div id="pied"> 
	   <p>pied</p>
	 </div>
	</div>
</body>
</html>


Quelques commentaires sur les styles pour te donner des debuts d'explications ou pistes .

Cordialement .
GC
Florent V. a écrit :
Déjà, le positionnement absolu me semble à la fois inutile et potentiellement problématique.
Je croyais que le positionnement avec float n'était au fond que de la "bidouille", et que cette propriété n'était pas censée servir à ça (je parle du menu, seulement... je suis tout à fait d'accord sur le fait que si c'est utilisé sur le bloc container, ça va donner une hauteur nulle au bloc parent, etc.) ?

Florent V. a écrit :
Positionnement absolu en utilisant à la fois bottom et top, ou à la fois left et right: ça permet de dimensionner l'élément en fonction des limites du plus proche élément positionné.
Réviser le positionnement absolu en CSS 2.1 si nécessaire. Smiley cligne
Oui, oui. Ce que je ne comprenais pas c'est pourquoi il y avait cette propriété alors qu'il disait ne pas vouloir positionner son menu en bas. Smiley smile
ah , je n'avais pas vu l'intervention de florent .

Pour les float , taxée de bidouilles , hmm j'espere que c'est de l'ironie , parceque sinon on retombe dans l'incompréhension massive des div contre table avec ses trolls sautillant de partout Smiley smile .

J'ai des souvenirs encore recent ou le display:table; etait bien mal vu Smiley cligne .

Si l'on maitrise bien une technique et a fortiori 'historique' : usage des float ou des tableaux , on a toute les chances de faire quelque chose d'efficaces et probablement pas " a la mode " . Certes , se mettre a la "page" ne fait aucun mal .

Le plus simple est toujours le plus confortable et stable , ça va de pair avec efficacité .

L'exemple precedent que je propose en est une application , pour le coté 'bidouilles' je ne suis pas parti sur le positionement absolu déja evoqué dans cet echange , j'ai opté pour une marge négative et un z-index ...

GC
phpdoesnotcare a écrit :
Je croyais que le positionnement avec float n'était au fond que de la "bidouille", et que cette propriété n'était pas censée servir à ça

Ma religion n'interdit pas le float. Smiley smile
Quant à savoir si c'est une bidouille, aucune idée, je ne suis pas dans le secret de l'âme des rédacteurs de CSS2.
<h1>ou bidouille , si c'est trop simple    et qui marche encore pas trop mal ...</h1>
GC > j'ai vu ce que tu as mis dans ton code ! ;P

Florent > la mienne non plus, en fait. Mais j'ai tendance à n'utiliser que position pour le positionnement, et je réserve float pour quand j'ai besoin d'un élément flottant par rapport à du texte (du style images pour illustrer un paragraphe, etc.).
Mais je suis encore jeune ; je tomberai peut-être sur un morceau de code où je serai obligé d'utiliser un float pour parvenir à mes fins. Smiley lol
Salut a tous,
alors je suis pas sur d'avoir tout compris, en faite vous êtes en train de me dire que ma méthode n'est pas la bonne ?
En plus mon footer ce retrouve tout en haut de la page, voici mon 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>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Grundge Blog</title>
<link href="css/global.css" rel="stylesheet" type="text/css" />
</head>
	<div id="header">
    	<img src="images/logo.png" />
        
        <ul class="menu_haut">
        	<li><a href="#">Accueil</a></li>
            <li><a href="#">PortFolio</a></li>
            <li><a href="#">Ressources</a></li>
            <li><a href="#">Tutoriels </a></li>
            <li> <a href="#">Contact</a></li>
        </ul>
        
    </div>
    <div id="flash">
    
    </div>
    <div id="content">
        <div id="menu">
    		<div class="titre_menu"><img src="images/rss_icon.png"/> Abonnez vous</div>
            <div class="content_menu">
            	<a href="#"><img src="images/abonnez.png" /></a>
            </div>
            <div class="titre_menu"><img src="images/rss_icon.png"/> Catégories</div>
            <div class="content_menu">
            	<ul>
                	<li><a href="#">Accueil</a></li>
                    <li><a href="#">PortFolio</a></li>
                    <li><a href="#">Ressources</a></li>
                    <li><a href="#">Tutoriels</a></li>
                    <li><a href="#">Contact</a></li>
                </ul>
                <div class="ins_conn"><a href="#">Se connecter</a><br/><a href="#">S'inscrire</a></div>
            </div>
            <div class="titre_menu"><img src="images/archive_icon.png"/> Archives</div>
            <div class="content_menu">
            	<p>	
                	Les archives de monblog.com<br/><br/>

					Celle ci sont stocké du 08 Mai 2006 a aujourd’hui ...<br/><br/>

					Bonne lecture [smile] 
                </p>
                <a href="#"><img src="images/archive.png" /></a>
            </div>
    	</div>
        
        <div id="page">
        	<h3>Lorem Ipsum </h3><span class="auteur">jeudi 24 février 2010 a 15:45  par Empereur</span>
            <p class="paragraphe">
            	Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Sed non risus. Suspendisse lectus tortor, dignissim sit amet, adipiscing nec, ultricies sed, dolor. Cras elementum ultrices diam. Maecenas ligula massa, varius a, semper congue, euismod non, mi. Proin porttitor, orci nec nonummy molestie, enim est eleifend mi, non fermentum diam nisl sit amet erat. Duis semper. Duis arcu massa, scelerisque vitae, consequat in, pretium a, enim. Pellentesque congue. Ut in risus volutpat libero pharetra tempor. Cras vestibulum bibendum augue. Praesent egestas leo in pede. Praesent blandit odio eu enim.<br/>
Pellentesque sed dui ut augue blandit sodales. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Aliquam nibh. Mauris ac mauris sed pede pellentesque fermentum. Maecenas adipiscing ante non diam sodales hendrerit. Ut velit mauris, egestas sed, gravida nec, ornare ut, mi. Aenean ut orci vel massa suscipit pulvinar. Nulla sollicitudin. Fusce varius, ligula non tempus aliquam, nunc turpis ullamcorper nibh, in tempus sapien eros vitae ligula. Pellentesque rhoncus nunc et augue. Integer id felis. Curabitur aliquet pellentesque diam. Integer quis metus vitae elit lobortis egestas.<br/><br/>

 Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Morbi vel erat non mauris convallis vehicula. Nulla et sapien. Integer tortor tellus, aliquam faucibus, convallis id, congue eu, quam. Mauris ullamcorper felis vitae erat. Proin feugiat, augue non elementum posuere, metus purus iaculis lectus, et tristique ligula justo vitae magna. Aliquam convallis sollicitudin purus. Praesent aliquam, enim at fermentum mollis, ligula massa adipiscing nisl, ac euismod nibh nisl eu lectus. Fusce vulputate sem at sapien. Vivamus leo. Aliquam euismod libero eu enim. <br/><br/>

Nulla nec felis sed leo placerat imperdiet. Aenean suscipit nulla in justo. Suspendisse cursus rutrum augue. Nulla tincidunt tincidunt mi. Curabitur iaculis, lorem vel rhoncus faucibus, felis magna fermentum augue, et ultricies lacus lorem varius purus. Curabitur eu amet.<br/>
            </p>
         	<h3>Lorem Ipsum </h3><span class="auteur">jeudi 24 février 2010 a 15:45  par Empereur</span>
            <p class="paragraphe">
            	Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Sed non risus. Suspendisse lectus tortor, dignissim sit amet, adipiscing nec, ultricies sed, dolor. Cras elementum ultrices diam. Maecenas ligula massa, varius a, semper congue, euismod non, mi. Proin porttitor, orci nec nonummy molestie, enim est eleifend mi, non fermentum diam nisl sit amet erat. Duis semper. Duis arcu massa, scelerisque vitae, consequat in, pretium a, enim. Pellentesque congue. Ut in risus volutpat libero pharetra tempor. Cras vestibulum bibendum augue. Praesent egestas leo in pede. Praesent blandit odio eu enim.<br/>
Pellentesque sed dui ut augue blandit sodales. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Aliquam nibh. Mauris ac mauris sed pede pellentesque fermentum. Maecenas adipiscing ante non diam sodales hendrerit. Ut velit mauris, egestas sed, gravida nec, ornare ut, mi. Aenean ut orci vel massa suscipit pulvinar. Nulla sollicitudin. Fusce varius, ligula non tempus aliquam, nunc turpis ullamcorper nibh, in tempus sapien eros vitae ligula. Pellentesque rhoncus nunc et augue. Integer id felis. Curabitur aliquet pellentesque diam. Integer quis metus vitae elit lobortis egestas.<br/><br/>

 Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Morbi vel erat non mauris convallis vehicula. Nulla et sapien. Integer tortor tellus, aliquam faucibus, convallis id, congue eu, quam. Mauris ullamcorper felis vitae erat. Proin feugiat, augue non elementum posuere, metus purus iaculis lectus, et tristique ligula justo vitae magna. Aliquam convallis sollicitudin purus. Praesent aliquam, enim at fermentum mollis, ligula massa adipiscing nisl, ac euismod nibh nisl eu lectus. Fusce vulputate sem at sapien. Vivamus leo. Aliquam euismod libero eu enim. <br/><br/>

Nulla nec felis sed leo placerat imperdiet. Aenean suscipit nulla in justo. Suspendisse cursus rutrum augue. Nulla tincidunt tincidunt mi. Curabitur iaculis, lorem vel rhoncus faucibus, felis magna fermentum augue, et ultricies lacus lorem varius purus. Curabitur eu amet.<br/>
            </p>
         	<h3>Lorem Ipsum </h3><span class="auteur">jeudi 24 février 2010 a 15:45  par Empereur</span>
            <p class="paragraphe">
            	Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Sed non risus. Suspendisse lectus tortor, dignissim sit amet, adipiscing nec, ultricies 										sed, dolor. Cras elementum ultrices diam. Maecenas ligula massa, varius a, semper congue, euismod non, mi. Proin porttitor, orci nec nonummy molestie, enim est eleifend mi, non fermentum diam nisl sit amet erat. Duis semper. Duis arcu massa, scelerisque vitae, consequat in, pretium a, enim. Pellentesque congue. Ut in risus volutpat libero pharetra tempor. Cras vestibulum bibendum augue. Praesent egestas leo in pede. Praesent blandit odio eu enim.<br/>
Pellentesque sed dui ut augue blandit sodales. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Aliquam nibh. Mauris ac mauris sed pede pellentesque fermentum. Maecenas adipiscing ante non diam sodales hendrerit. Ut velit mauris, egestas sed, gravida nec, ornare ut, mi. Aenean ut orci vel massa suscipit pulvinar. Nulla sollicitudin. Fusce varius, ligula non tempus aliquam, nunc turpis ullamcorper nibh, in tempus sapien eros vitae ligula. Pellentesque rhoncus nunc et augue. Integer id felis. Curabitur aliquet pellentesque diam. Integer quis metus vitae elit lobortis egestas.<br/><br/>

 Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Morbi vel erat non mauris convallis vehicula. Nulla et sapien. Integer tortor tellus, aliquam faucibus, convallis id, congue eu, quam. Mauris ullamcorper felis vitae erat. Proin feugiat, augue non elementum posuere, metus purus iaculis lectus, et tristique ligula justo vitae magna. Aliquam convallis sollicitudin purus. Praesent aliquam, enim at fermentum mollis, ligula massa adipiscing nisl, ac euismod nibh nisl eu lectus. Fusce vulputate sem at sapien. Vivamus leo. Aliquam euismod libero eu enim. <br/><br/>

Nulla nec felis sed leo placerat imperdiet. Aenean suscipit nulla in justo. Suspendisse cursus rutrum augue. Nulla tincidunt tincidunt mi. Curabitur iaculis, lorem vel rhoncus faucibus, felis magna fermentum augue, et ultricies lacus lorem varius purus. Curabitur eu amet.<br/>
            </p>
        </div>
	</div>
    
    <div id="footer">
    
    </div>
<body>
</body>
</html>



@charset "utf-8";
/* CSS Document */

*{margin:0; padding:0;}
a img{border:none;}

body{background:#f1e1c9;}

#header{
	color:#FFF;
	width:100%;
	height:46px;
	background:#403424;
	position: relative;
}
#flash{
	width: 100%;
	height: 260px;
	background: #007caa url(../images/flash_background.png) no-repeat;
	margin-left:auto;
	margin-right: auto;
	background-position:center;
	border-bottom: 5px solid #FFF;
	border-top: 5px solid #FFF;
}
#content{
	width: 100%;
	height: auto;
	position:relative;
}
#menu{
	width:180px;
	height: 500px;
	position:absolute;
	right:0;
	top:30px;
	padding-left: 1px;
	padding-right: 1px;
	margin-bottom: 50px;
}
#page{
	width: auto;
	height: 700px;
	position: absolute;
	top:30px;
	left:50px;
	right: 250px;
}
#page h3{
	color:#403424;
	border-bottom:1px solid #403424;
	font-family:Candara;
	font-size:20pt;
}
#page .auteur{
	color:#998974;
	font-size: 9pt;
	font-family:Tahoma, Geneva, sans-serif;
}
#page .paragraphe{
	color:#403424;
	font-family:Tahoma, Geneva, sans-serif;
	font-size: 11pt;
	margin-top: 20px;
	margin-bottom: 30px;
}

#header .menu_haut{
	position:absolute;
	right:0;
	top: 6px;
}
#header .menu_haut li{
	display: inline;
	font-size: 16pt;
	margin-right: 20px;
	text-align:center;
}
#header .menu_haut li a{
	color:#FFF;
	font-family: Verdana, Geneva, sans-serif;
	text-decoration:none;
}
#header .menu_haut li:hover{border-bottom: 3px solid #FFF;}
#menu .titre_menu img {float: left; margin-right:5px;}

#menu .titre_menu{
	color:#403424;
	font-size:16pt;
	border-bottom: 1px solid #403424;
}

#menu .content_menu{
	background:#e7d7be;
	-moz-border-radius:10px 10px 10px 10px;
	margin-top: 10px;
	width: 168px;
	height:auto;
	margin-bottom: 15px;
	padding: 5px;
	color:#403424;
	list-style-image:url(../images/puce.png);
}
#menu .content_menu ul{
	margin-left: 30px;
}
#menu .content_menu a{text-decoration:none; color:#403424;}

#menu .content_menu .ins_conn{text-align:center;font-weight:bold;}
#footer{
	width:100%;
	height: 50px;
	background:#000;
	clear: both;
}


Je comprend pas ce qui cloche, voici le rendu que ça me donne,
Aperçu
On voit bien que le footer est tout en haut de mon écran, sous le header Oo

<edit>Image trop large enlevée
Modifié par Julien Royer (26 Apr 2010 - 13:22)
C'est à cause de #page et de #menu qui sont tous les deux positionnés de manière absolue. Du coup c'est comme si #content était vide, donc avec une hauteur nulle.

Je n'irai pas chercher, mais je suis sûr d'en avoir déjà parlé. Smiley cligne

--- édit -----
Il est normalement inutile de chercher à positionner #page. Laisse ce bloc se positionner tout seul, de manière statique (quitte à jouer sur les marges si tu veux un décalage, etc.)
Modifié par phpdoesnotcare (26 Apr 2010 - 13:13)
Empereur a écrit :
en faite vous êtes en train de me dire que ma méthode n'est pas la bonne ?

Oui. Je te laisse relire attentivement. Smiley smile
Alors j'ai tout bien lu Smiley biggrin

Si je comprend bien je doit :
Supprimer mon div content ,
Mettre mon menu en float right avec une largeur prédéfini,
mettre mon div page en float left sans indiqué de largeur et il prendra automatique la place qui peut .

C'est ça ?
En fait tu n'as pas besoin de mettre page en flottant et du coup tu n'as pas a s'inquieter de sa largeur . Il te suffit de modifier son contexte de formatage pour qu'il s'adapte a la place que lui laisse le menu qui flotte.

Bon , bien sur ,je parle de mon exemple ... as tu compris comment fonctionner la partie .content , .droite , .gauche et .pied , et remarquer que seul le menu est flottant et u'il est aussi le seul a avoir une largeur definie ?

Cordialement
Pages :
Sujet clos
Aller à