28173 sujets

CSS et mise en forme, CSS3

Bonjour,

je vous expose mon problème :
j'ai un conteneur div de 900*600px. (absolute)
Dedans j'ai plein de div absolute tout placé dans la balise div du conteneur. (on obtient un site centré)
le problème est que sur une page le texte est trop long donc le div dépasse du conteneur et ne le suit pas. Moi je voudrais que le conteneur prenne la taille en fonction du texte. Impossible a faire, j'ai même beau utiliser un tableau je n'y arrive pas.

Le code n'est pourtant pas compliqué juste un div conteneur avec les tailles, les left etc, idem pour le div contenu.

Quelq'un pourrait-il résoudre mon pb?
merci
Bonsoir,
malheureusement in n'existe pas a ma connaissance de méthode
robuste pour pallier à ce genre de problème (prise en compte d'un élément
enfant en position absolue) contrairement a l'utilisations des flottant.
Cela se résoud souvent avec un padding sur le div conteneur.

Pour qu'on puisse t'aider il faudrait nous expliquer précisément ce que
tu souhaites obtenir.
Modifié par Hermann (03 Apr 2007 - 03:17)
Bonsoir,
ben le problème c'est que je ne peux pas passer le source car c"est un travail pour une entreprise.

Pour résumer, le site est en CSS il est rectangle (900par 600) et fixe. Toutes les textes des pages internes tiennent dans le cadre consacré au texte inclue dans le conteneur. Seulement dans une page le texte est trop long donc celui ci deborde du site vers le bas.

Pour cela je dois enlever la taille fixe en hauteur du conteneur qui est de 600px. Celui ci devrait s'adapter donc au texte proportionnellement à sa longueur.

Or tout est en absolute par rapport au conteneur et quand j'enlève la taille en hauteur, la couleur d'arrière plan disparait (il ne pren pa en compte le texte, la longueur). Or je le voudrais.

J'espère que j'ai été plus explicite !
Salut,

Je pense qu'il faudrait envisager une mise en page sans absolute, si tu ne peux nous donner un lien en ligne au moins un croquis se serait suffisant pour t'aider...

laisse déjà ton conteneur dans le flux avec un width défini, un overflow: hidden et un margin: auto ...
Modifié par ghost (02 Apr 2007 - 21:01)
Salut,

Pas besoin d'absolute ... pour cela

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
  <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" >
			
<head> 
   <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
  <style type="text/css"> 
#conteneur{
width: 900px;
overflow: hidden;
background: yellow;
margin: auto;
}

ul{
list-style-type: none

}

li{
width: 150px;
height: 40px;
background: red;
float: left;
margin-left: 10px;

}

#contenu{
width: 700px;
overflow: hidden;
margin: 75px 50px 30px 150px;
background: lime;
clear: both;

}

#contenu p{

margin: 15px 15px ;


}

  </style>

  
</head>
<body>
<div id="conteneur">
	<ul>
		<li></li>
		<li></li>
		<li></li>
	</ul>
	<div id="contenu">
		<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Donec diam. Duis lorem. Maecenas sed ligula. Proin mattis, enim non eleifend consequat, arcu velit rhoncus lacus, auctor tristique libero tellus et diam. Aenean scelerisque, quam non adipiscing vehicula, velit urna cursus arcu, in tempor quam sem eu pede. Nam feugiat turpis ut velit. Pellentesque arcu. Nam consequat, orci at luctus ullamcorper, neque enim iaculis sem, at condimentum ante justo et neque. Suspendisse sagittis ligula quis risus. Donec eu orci eget nibh rutrum eleifend. Nunc ultrices gravida urna. Nam neque. Duis vulputate mattis velit. Suspendisse potenti. Fusce placerat, dolor ut gravida iaculis, dolor est rutrum ipsum, vitae tempor augue urna vel ligula. Mauris luctus mi at purus.
		</p>
	</div>
</div>
</body>
</html>