[html] Disposition de la page

Résolu/Fermé
PL29 - 12 juin 2014 à 14:53
 PL29 - 12 juin 2014 à 15:53
Bonjour,

J'ai un petit problème sur la disposition de mes div ! :/

En fait je passe par une fonction javascript lorsque je clique sur un bouton, cette fonction crée 3 div. Dans le premier elle crée une liste déroulante, dans le second une zone de texte et dans le troisième une image. (Je précise qu'avec cette fonction même en la modifiant elle ne peut pas créer plusieurs objets dans le même Div).

Bref mes 3 div qui se situent dans un grand div ('cadre') ne sont pas alignés horizontalement.

Je voudrais savoir si une balise ou une ligne de code peut permettre de les aligner sans être obligé de créer un fichier CSS spécialement pour ça ?

Je vous remercie d'avance ;)



A voir également:

4 réponses

salut,

Je voudrais savoir si une balise ou une ligne de code peut permettre de les aligner sans être obligé de créer un fichier CSS spécialement pour ça ?


ben si tu as déjà un fichier css...pas besoin d'en créer un autre.

il faut savoir qu'un "div" au naturel prend 100% de largeur du block conteneur.

donc

si tu as 3 div dans ton div cadre essaye par exemple (à adapter);

#cadre div{
width: 33%;
display: inline;
}


׺°"~'"°º×]|I{*------» LÖBÖTÖ «------*}I|[׺°"~'"°º×
0
Merci d'avoir répondu aussi rapidement ! :)

Bah non justement je n'ai pas de fichier CSS et ça m'embête un peu de devoir en créer un rien que pour ça ! :/

Bah là bizarrement j'ai un div conteneur de 1000px de large contenant :
- un div large de '100px' avec une liste déroulante de même taille
- un autre div large de '420px' avec une zone de texte
- un dernier div large de '40px' avec une image

Si on fait le calcul la largeur total des éléments mis bout à bout est de 560px
or le conteneur en fait 1000 c'est pour ça que je ne comprends...

Si tu peux m'aider à trouver d'où vient le problème et comment le résoudre ce serait sympa de ta part. Et si tu as une façon de faire sans fichier CSS ce serait encore mieux.
0
salut, tu met dans tes 3 div à aligner:

style="display: inline-block;"


par exemple :

<div id="cadre" style="width:1000px;">
			<div style="width:100px; display: inline-block;"></div>
			<div style="width:420px; display: inline-block;"></div>
			<div style="width:40px; display: inline-block;"></div>
		</div>


׺°"~'"°º×]|I{*------» LÖBÖTÖ «------*}I|[׺°"~'"°º×
0
Merci beaucoup pour la rapidité et la pertinence de tes réponses !

Ça marche niquel !

J'ai juste mon image qui est quelques millimètres plus haut que le reste je ne comprends pas pourquoi ! Si tu as une petite idée je suis preneur sinon tqt c'est pas grave !


Je vais donc passer ce sujet en Résolu :)
0