Problème de mise en page HTML (débutant)Résolu

Question

Bonjour,


J'ai un problème de mise en page dans un site web assez simple:


3 divisions (div)


- le premier contenant les deux autres

- le deuxième à gauche contient un menu pour naviguer

- le troisième sur la partie droite (à l'intérieur du premier div)
contient un tableau dynamique (gridview) dont je ne connais pas la
taille (variable selon le nombre de lignes).


Je souhaiterais que les deux divisions "div_menu" et "div_tableau"
aient la même hauteur. On m'a orienté en me disant de rajouter une 3e
div (le premier que j'ai énuméré) et de mettre Height à 100% dans les
deux autres.


Le problème est que la hauteur de ma division "div_menu" n'augmente pas
avec les deux autres divisions, apparemment Height:100% ne fonctionne
que lorsque la hauteur Height du composant parent est défini...


Comment faire dans le cas où la hauteur Height à définir n'est pas connue dans un cas dynamique ?

ggtry · Accepted Answer

Bonsoir, (c'est vrai que ce n'est pas le bon endroit, mais bon...) Un expert en css me contredira peut-être, mais c'est une des choses qui paraissent évidentes, et ne le sont pas du tout en css. Le plus simple, j'en ai peur, est de revenir à la bonne vieille table avec tr et td. Sinon, tu peux regarder ici : http://forum.alsacreations.com/faq/faq-17-Comment-faire-des-quotcolonnesquot-de-meme-hauteur-.html Ou alors, tu passes par les tables... : tu peux garder tes trois css avec le height:100%, donner au premier la propriété "display:table;" et aux deux autres la propriété "display:table-cell;". Ensuite, il te faudra changer tes div, dans l'ordre, en table pour le premier et pour les deux autres en td. Tu dois aussi ajouter un après . (pour le menu, tu peux ajouter vertical-align:top à ton css pour éviter que le texte ait un centrage vertical. Cordialement GGtry

Marco8692 · Answer

Hmm je pense que je me suis gourré d'emplacement pour ce message, mais je n'ai pas trouvé de rubrique 'html'.
J'avais choisi asp.net / sql server parce que mon site (complet) utilise ces langages (avec C# coté serveur). Mais la question ne porte que sur un notion html je pense.

Marco8692 · Answer

Bonjour, ta solution et une autre avec les div fonctionnent
- soit je mets ton tableau en mettant une colonne coloriée
- soit je mets une div coloriée contenant 2 autres div (la premiere juste pour décaler la 2e avec la même couleur que le fond
et la 2e en blanc pour faire comme si il n'y avait rien.

Les deux solutions fonctionnent, la 2e me semble moins instinctive, je laisse mon maître de stage décider de la méthode ^^

Merci beaucoup

Marco8692 · Answer

Finalement je vais utiliser ta méthode de tableau, parce que avec les div ça marche lorsque c'est la partie droite qui est étirée, mais pas lorsque c'est la gauche... ;)

Problème de mise en page HTML (débutant)

4 réponses

Votre réponse

Discussions similaires