[xhtml/css] Mon bloc ne s'étire pas avec son contenu (débutant)

Recherche :

Mot : Pseudo : Filtrer
Bas de page
Auteur	Sujet : [xhtml/css] Mon bloc ne s'étire pas avec son contenu (débutant)

blazer

Bonjour,
Alors voilà, je débute totalement en programmation web, j'ai déjà réalisé une grosse partie de mon site sans trop de problème grâce aux différents tutos et à ce forum. Je bloque aujourd'hui sur une des pages.
Alors puisqu'une image vaut mieux qu'un long discours voilà mon problème:
Ce que je veux:

Ce que j'ai:

Voici mon code:
Html:

Code :

<div id="centre">
<h2>Composition du bureau</h2>
<div class="float">
<img src="images/photo.jpg" alt="Membre" /><br />
<p>Lucky Luke<br />
Président<br />
MSTCF 2</p>
</div>
<div class="float">
<img src="images/photo.jpg" alt="Membre" /><br />
<p>Obiwan Kenobi<br />
Vice-Président<br />
DESS CAAE</p>
</div>
<div class="float">
<img src="images/photo.jpg" alt="Membre" /><br />
<p>Mario Bros<br />
Secrétaire<br />
MSG 2</p>
</div>
<div class="float">
<img src="images/photo.jpg" alt="Membre" /><br />
<p>Mario Bros<br />
Secrétaire<br />
MSG 2</p>
</div>
</div>

Le css:

Code :

#centre {
margin-left: 150px;
margin-right: 150px;
border: solid black 1px;
}
.float {
float: left;
text-align: center;
margin-left: 10px;
margin-right: 10px;
}

Et donc j'aimerais que la bordure ne s'arrête pas à <h2> comme c'est le cas avec mon code. Je pourrais passer par un tableau mais je préfère connaître la solution avec des div pour l'instant.
Merci d'avance por votre aide

Message édité par blazer le 12-10-2005 à 18:56:06

Publicité

sibelius

Vous êtes sûr ?

Hello,

C'est le comportement normal des éléments flottants : ils sortent du flux et "dépassent" de leur conteneur.
Il faut utiliser un élément avec la propriété clear pour arranger cela.

Openweb explique bien tout ça dans son article sur le positionnement flottant.

Bonne chance

---------------
www.polychromies.com (Portfolio) - www.photographier-bebe.com (livre photo de bébé) - www.alsacreations.com

blazer

Merci beaucoup de m'avoir aidé Je suis parti sur le tutorial de openweb et effectivement j'y ai trouvé la solution, ajouter un espace insécable dans un div avec la propriété clear me donne le résultat voulu .
Encore merci, bonne soirée .

FORUM HardWare.fr

Programmation

HTML/CSS

[xhtml/css] Mon bloc ne s'étire pas avec son contenu (débutant)

Sujets relatifs
Centre un bloc contenant des float	lecture du contenu d'une page HTML
[RESOLU][SQL/Access]Impossibilité de modifier le contenu de mes tables	[RESOLU] Petit probleme debutant sur constructeur
Un Guide du Débutant pour la Validation	XHTML et textarea contenant des balises HTML
Perl et Mysql --> débutant	copier le contenu d'un fichier texte dans un fichier html
CSS : Afficher un bloc lors du survol d'un lien	[Cobol][Débutant] !!! truc illogique
Plus de sujets relatifs à : [xhtml/css] Mon bloc ne s'étire pas avec son contenu (débutant)

Page générée en 0.041 secondes