Aller au contenu

Comment "Encapsuler" un bloc dans un autre


MikaA

Sujets conseillés

Bonsoir à tous,

Je me suis mis récemment à jour niveau XHTML (valide!) et CSS, et me voilà face à un problème qui peut paraître simple, mais dont je n'ai pas encore trouver de solutions...

Imaginons ceci :

******* attention, ceci est du code pur et dur ! C'est pas pour les rigolos !********

<div id="boite1">

<div id="boite2">

//Ici, mettre un texte long !

</div>

</div>

******* attention, fin du code ! On peu rigoler maintenant !********

Pour imager un peu le problème, mettons un fond pour la boite1

#boite1

{

background-color: F00;

}

Que se passe-t'il ?

Sur FireFox, la boite 1 ne s'agrandie pas pour contenir l'ensemble du texte (si il est long), alors qu'elle s'agrandie sur IE. Alors oui, je sais, c'est un comportement normal...

Question

Comment faire en sorte que la boite1 s'adapte à la taille de la boite2 sachant qu'on ne connaît absolument pas la taille qu'aura le texte de la boite 2 ?

Merci et bonne soirée :)

Lien vers le commentaire
Partager sur d’autres sites

Salut MikaA...

Première chose, pour la couleur, c'est :

background-color: #F00;

Ensuite, pour que la boite1 s'agrandisse par rapport à la 2, il faut ne pas donner de taille en hauteur (j'imagine que tu veux que la boite s'allonge)...

Donc tu mets la largeur souhaitée avec width , et pas de height...

Tiens nous au courant.

Fanou

Lien vers le commentaire
Partager sur d’autres sites

Bonsoir MikaA,

je ne comprend pas pourquoi tu veux insérer un div dans un div ?

Pour mettre en forme le contenu dans la boite 1, tu peux tout simplement utiliser les balises adéquates comme :

<p id=""><p>

ou <ul>

<li></li>

</ul>

En supprimant les marges dans ta feuille de style de ces conteneurs, non ?

Lien vers le commentaire
Partager sur d’autres sites

salut,

Comment faire en sorte que la boite1 s'adapte à la taille de la boite2 sachant qu'on ne connaît absolument pas la taille qu'aura le texte de la boite 2 ?

En fonction du code que tu as donné la boite 1 ne peut que s'adapter au contenu de la boite 2 et ce quelque soit le navigateur !!!

Si y tu a un problème et que tu souhaites une solution tu devrais commencer par rédiger ta question de manière plus précise et compréhensible ;)

merci

Lien vers le commentaire
Partager sur d’autres sites

Veuillez vous connecter pour commenter

Vous pourrez laisser un commentaire après vous êtes connecté.



Connectez-vous maintenant
×
×
  • Créer...