28173 sujets

CSS et mise en forme, CSS3

On va très certainement me dire que des sujets similaires ont été posté seulement je ne les comprend pas.

Voici mon problème

Je possède 2 div gauche et contenu

il arrive que la div contenu dépasse de la fenêtre. Je voudrait que la div gauche fasse au minimum la taille de la fenêtre et au maximum la taille de la div contenu

mais sa marche pas

voila mon code

css

p:first-letter 
{ 
padding-left: 50px; 
} 
#contenu {position:absolute;
left:185px;
right:0px;
top:79px;
}
#gauche {position:absolute;
left:0px;
top:79px;
bottom:0px;
background-color:#00aeef;
width:185px;
}
#bandeau{position:absolute;
left:0px;
top:0px;
right:0px;
background-color:#00aeef;
}
#para1{
	padding:60px 30px 10px 10px;
}
BODY {
BACKGROUND: #999999 ; FONT: 11px verdana, sans-serif;
}



html


<style type="serig.css">
</style>
<link href="serig.css" rel="stylesheet" type="text/css">
</head>
<body>
<div id="bandeau">
<img src="images/cocktail.png" width="530" height="70" id="cocktail">
</div>
<div id="gauche"><p>ici le texte<\p>
</div>
</div>
<div id="contenu">
<p id="para1"><p>ici le contenu<\p> 
</div>
</body>
</html>


aidez moi s' il vous plait
Modifié par SuperNounours (12 Apr 2007 - 14:36)
Salut

Tout d'abord, peux-tu mettre ton code entre les balises [*code*] et [*/code*] (sans les *) pour que cela soit un peu plus lisible...

Ensuite, j'ai pas tout saisis ce que tu veux faire, mais d'après ce que j'ai compris, la balise min-width devrais contribuer à ton bonheur.

Ensuite, les position:absolute; sortent tes div du flux de la page, et comme ton div gauche et ton div contenu "communiquent" dans ta page, ne peux-tu pas à la place utiliser des float ?
Je voudrai que la div gauche soit toujours à la hauteur de la page, alors que seul le contenu de la div contenu varie, et donc fait augmenter la taille de la page.

j' ai essayé min-height, vu que je veu que ce soit la hauteur de la div gauche qui soit toujours de la taille de la page.
mais je ne suis pas parvenu à les faire fonctionner

et concernant les float Smiley sweatdrop je ne sais pas comme sa marche Smiley sweatdrop
en fait pour le moment je lui ai donner une largeur, une position à partir du haut (top) et je lui ai donner bottom : 0, donc il se colle au bas de la fenêtre, mais pas de la page, et width 100% ne marche pas.

Je vais regarder le tuto
si tu veux qu'il se colle en bas de page et non en bas de fenêtre. met un position:relative; a ton conteneur de page.
Modifié par zmove (12 Apr 2007 - 15:09)
Seulement si je met position : relative;
le contenu de la div gauche n' exsiste plus.

Pour être plus clair il ya une anim flash dans cette div, si je met en relative, il n' est plus positionné comme je le désirai, et en plus la div n' est plus rempli de la couleur que je désirait.

Bref c' est comme si elle n' existait plus
Modifié par SuperNounours (12 Apr 2007 - 15:21)
On peut voir la page complète ?
Et si possible avoir un aperçu solide de ce que tu voudrais réaliser (image, description, exemples de choses équivalentes en ligne...).

Au passage, une bêtise qui traine dans ton code :
<style type="serig.css">
</style>
voila la barre bleu sur toute la hauteur de la page, parfait quand le contenu ne fait qu' une page.

upload/11850-1.jpg

Par contre sur une page ou le contenu est plus long, si l' on descend l' ascenceur on peut voir que la barre bleu ne fait pas toute la hauteur

upload/11850-2.jpg
Modifié par SuperNounours (12 Apr 2007 - 15:45)