Aller au contenu

Problème d'héritage de taille d'une div


Shinuza

Sujets conseillés

Salut à toutes et à tous

J'ai retapé un site pour m'amuser, seulement je suis confronté à deux problèmes.

Voici les url :

Avant : http://graphiworld.free.fr/v3/

Nouvelle version : http://verybadman.free.fr/html/

Les différences soint insignifiantes? C'est normal, j'ai juste retapé le code pour le rendre plus conforme aux standards.

Seulement :

-Opera et Firefox n'interprètent pas le menu de la même manière, l'un crée un décalage entre le menu et le titre <h2> et l'autre nom.

Du coup, j'ai ajusté sous firefox, mais Opera reste orphelin

-Deuxième problème plus grave, j'ai une div (d1) de mise en page qui à également un fond avec répétition en y.

Et cette div contient deux div, une pour le menu(d2), et l'autre pour le contenu(d3).

Seulement, le menu et le contenu n'influe pas du tout sur la hauteur de la div, j'ai défini ici une hauteur minimale pour des besoins de visus, mais quoi qu'il en soit, si le contenu dépasse cette hauteur, la div (d1) ne suit pas.

Code source : http://verybadman.free.fr/html/index.txt

Feuille de style : http://verybadman.free.fr/html/styles/style.css

Quelqu'un aurait une idée pour que la hauteur soit en rapport avec le contenu?

Cordialement

Ps : Par ailleurs, si vous avez des remarques à emettre sur le code ou la sémantique, n'hésitez surtout pas, c'est fais pour ça :D

Modifié par Shinuza
Lien vers le commentaire
Partager sur d’autres sites

Salut Shinuza,

pour ce qui du décalage vers la gauche avec Opera. Cela doit venir de ton margin-left:-33px; sur la class #menu li Je ne vois pas vraiment à quoi ca sert d'ailleurs car cela ne semble etre interprété que par Opera. Normalement tu dois doit pas avoir besoin de margin négatif dans ton cas.

Pour ce qui est de la hauteur adaptable, il faut que tu rajoute un div avec un clear:left; ou clear:both; juste apres le code du <div class="contenu"> pour que tes 2 div menu et contenu prenne toute la hauteur du div global.

Le mieux pour cela serait de prendre le div class="bottom" et de la mettre à l'interieur du div global juste après le div contenu. Après dans la CSS rajoute clear:both; et ca devrait faire l'affaire. Il y aura juste surement quelques reglages à faire avec les images de fond.

Niveau sémantique c'est plutot pas mal mais pour le moment il n'y a pas encore beaucoup de code. Juste un truc utilise peut-etre plutot des ID que des CLASS pour les éléments uniques tel que les div contenu, bottom, footer ...

voila joli travail :)

Lien vers le commentaire
Partager sur d’autres sites

Hello

Merci de ta réponse.

J'ai du mettre le clear both sur la class bottom, et je l'ai déplacée dans la div globale et sous la div contenu.

Cela fonctionne parfaitement, merci :D

Par contre lorsque je retire le margin-left:-33px sur le li, voila ce que ça donne : http://verybadman.free.fr/html/index2.html

Ca fonctionne sur Opera mais pas sous FF et IE est hacké donc aucune influence.

http://verybadman.free.fr/html/index2.html

Je dois essayer de virer le <h3> pour les titres de sections du menu pour les remplacer par des <ul></ul> en cascade, donc je verrais si jepeux corriger le problème par ce biais ;)

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...