Organisation auto des div - HTML CSS

Résolu/Fermé

electroking Messages postés 234 Date d'inscription dimanche 14 septembre 2014 Statut Membre Dernière intervention 22 juin 2021 - Modifié par electroking le 20/04/2015 à 09:55
electroking Messages postés 234 Date d'inscription dimanche 14 septembre 2014 Statut Membre Dernière intervention 22 juin 2021 - 20 avril 2015 à 11:26

Salut à tous, voila mon problème : sur un site web que je fais, j'ai une div, qui occupe toute la largeur (ici en noir) et à l'intérieur j'ai plusieurs div (ici en orange) avec une hauteur et une largeur fixe. Et je voudrais que ces div s'organisent de façon à prendre toute la place disponnible même quand le fenêtre change de taille (image ci-dessous) :

mais quand je place mes div, elle se placent les unes en dessous des autres.
J'ai cherché mais je n'ai trouvé que la propriété css white space (un truc comme sa) qui ne marche pas...
Une idée ?
merci d'avance pour votre réponse

A voir également:

Html css div
Editeur html - Télécharger - HTML
Div c++ - Télécharger - Langages
Html download - Télécharger - HTML
Image cliquable html ✓ - Forum Réseaux sociaux
Br html ✓ - Forum Webmastering

3 réponses

Réponse 1 / 3

jordane45 Messages postés 38144 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 21 avril 2024 4 650
20 avril 2015 à 09:57

Bonjour
Change les largeurs fixes par des pourcentages.....

Réponse 2 / 3

Orci76 Messages postés 92 Date d'inscription lundi 20 décembre 2010 Statut Membre Dernière intervention 21 avril 2015 5
20 avril 2015 à 11:22

Salut,

Pour que leur taille change selon la place disponible, c'est effectivement les pourcentages (ou vw/vh) qu'il faut utiliser.
Pour ce qui est du placement, regarde du côté du float: left.

Exemple:

<div id="black">
	<div class="orange fleft">Hello!</div>
	<div class="orange fleft">Hello!</div>
	<div class="orange fleft">Hello!</div>
</div>

.black {
	width: 100%;
	border: 1px solid black;
}
.orange {
	margin: 1.5%;
	width: 30.3%;
	background-color: orange;
}
.fleft {float: left;}

Réponse 3 / 3

electroking Messages postés 234 Date d'inscription dimanche 14 septembre 2014 Statut Membre Dernière intervention 22 juin 2021 6
20 avril 2015 à 11:26

Tout d'abord merci de votre réponse, ensuite, je crois que je me suis mal exprimé mais j'ai trouvé ce que je voulait : la commande css display: inline-block; .

Discussions similaires

&nbsp ; Quelle Fonction ?

Espace en HTML

[CSS] Forcé retour à la ligne

la balise <br> ou <br />

trait horizontal avec du css

Discussions similaires

Newsletters