Aller au contenu

Problème footer...

Hells_Dark

Par Hells_Dark
dans (X)HTML et CSS

 Partager

Sujets conseillés

Hells_Dark

Hells_Dark

Posté
Posté

Bonjour tout le monde,

Bon mon problème ne va pas être facile à régler vu que pour des questions technique, je ne peux pas vous donner le CSS que j'utilise (peut-être plus tard). Mais je vais tacher de vous expliquer mon problème.

Bon, alors, mon site est dans un div d'une bordure noire d'un pixel et d'une hauteur inimale de 500 pixels. Je voulais mettre un footer dans ce div, c'est à dire un espace en bas avec une bordure d'un pixel en haut contenant le copiriht et autres.

CSS du footer :

div#footer {
margin : 10px 0 0 0;
border-top : 1px solid #000000;
}

Et donc dans mon code xhtml , ça me donnait quelquechose du genre

<div id="contenu">
blabalabala
<div id="footer">copiright</div>
</div>

Donc tout se déroule bien sous Mozilla (brave mozilla :lol: ) mais sous IE, la bordure du haut du footer est JUSTE sous le blablabla et cela me fait un footer immense:blink: .

Si vous comprenez mal mon problème, posez des questions, n'hésitez pas....

Lien vers le commentaire
Partager sur d’autres sites
Hells_Dark

Hells_Dark

Posté
  • Auteur
Posté (modifié)

Salut Pierre

Oui, j'ai mis

height : 10px;

Mais cela n'a rien changé... :unsure:

En fait il se potitionne par raport au blabla (plus il ya de blabla plus il est bas) et je voudrais qu'il se positionne par rapport au bas de la div contenu... :rolleyes:

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

Hells_Dark

Posté
  • Auteur
Posté (modifié)

Oui ma div contenu a une hauteur minimale (obligé avec mon menu...)

Mais j'avais mis un subterfuge pour IE, en fait j'ai mis height : inherit et le body avait un height : 100% ou qqch comme ça...

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

Hells_Dark

Posté
  • Auteur
Posté

Ca me fait un footer juste sous le contenu d'environ 10 pixels de hauteur (sachant que je n'ai pas spécifié de hauteur au footer)...

Avec un grand espace en dessous (espace qu'il ne devrait pas y avoir)...

Je répété que sous mozilla, il n'y as pas de pb...

Lien vers le commentaire
Partager sur d’autres sites
Hells_Dark

Hells_Dark

Posté
  • Auteur
Posté (modifié)

J'ai "résolu" mon pb, j'ai mis height : 500px au lieu de min-height : 500 px que IE comprenait pas...

en fait l'architecture du site c'était plutot

<div id="ensemble"><div id="contenu"><div id="footer"></div></div></div>

Et j'avais mis min-height : 500px, le footer alait donc en dessous pour Mozilla mais comme IE comprenait mal, ça marchait pas... :blink:

Au fait c'est quoi la vraie différence entre min-height et height à part que le premier 'est pas compris par IE ? :unsure:

Arg, je viens de voir la différence, dès que el contenu dépasse 500px, ça dépasse (ça dépasse pas sous IE car il interprete mal le code...)du div de hauteur 500px tandi que quand c'est min-height : 500 px, la div s'agrandit, je ne peux dnc pas changer mon min-height en height...

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

Pierre6020

Posté
Posté

-height, c'est la hauteur fixe de ton bloc (si le texte est trop long, ca dépasse).

-min-height, c'est la taille minimum de ton bloc (apres il s'allonge en fonction du texte)

-min-height n'est pas reconnu par IE.

Lien vers le commentaire
Partager sur d’autres sites
Hells_Dark

Hells_Dark

Posté
  • Auteur
Posté (modifié)

C'est ce que j'avais cru comprendre... mais comment mettre un height pour IE sans en mettre par Mozilla, je cherche sur le site que tu as joint mais je ne trouve pas...

JE retourne chercher...;)

PS : en fait, si je sis obligé de mettre une hateur minimale, c'est à cause de mon menu qui est en position absolute...

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

Hells_Dark

Posté
  • Auteur
Posté (modifié)

Oui, j'ai déjà lu ce sujet mais je ne vois toujours pas la solution...

je ne peux pas mettre <!--[if IE]>...<![endif]--> dans ma feuille de style...

LA solution serait d'utiliser ceci :

/* For cool browsers */

body > #MyPage

{

max-width: 796px;

width: auto;

}

Mais je comprend mal comment...

div#contenu {

body > min-height : 500px

height : 500px

? nan ça doit pas être ça :(

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

Pierre6020

Posté
Posté 

<link href="../site.css" rel="stylesheet" type="text/css" />
<!--[if IE]><link rel="stylesheet" href="../IE.css" type="text/css" /><![endif]-->

N'oublie pas qu'IE charge quand même la première feuille de style,

donc il ne faut pas refaire une feuille à part entière, seulement changer ce qui ne va pas.

Lien vers le commentaire
Partager sur d’autres sites
Hells_Dark

Hells_Dark

Posté
  • Auteur
Posté (modifié)

Merci Pierre

J'aurais bien aimé comprendre l'autre possibilité, celle que dont je parlais au post précédent.

EDIT : c'est bon j'ai capté, je vais essayer

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

Hells_Dark

Posté
  • Auteur
Posté (modifié)

Oui, j'ai compris ça mais...heu...

J'ai fait ça :

div>#contenu

{

min-height : 500px;

}

Ya Que Mozilla qui le comprend mais je peux pas mettre ensuite une hauteur de 500px uniquement pour IE...

Ya un moyen en utilisant ce procédé ?

Autres question : IE comprend-il height : 100% ? J'ai une div 1 de hauteur 100% dans une div 2 de hauteur 500 pixels.

Dans IE, la hateur de la div 1 est équivalente à la hauteur du contenu de celle ci, et non pas à la hauteur de la div 2. Comment y remédier ?

J'ai essayé en faisant height : inherit, même effet.

Tout ecla marche bien sur parfaitement avec Mozilla

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

Hells_Dark

Posté
  • Auteur
Posté (modifié)

Pour le premier problème, c'est réglé grace à ce lien où c'était bien expliqué :

http://www.alsacreations.com/blog/index.ph...ternet-explorer

Par contre, j'ai toujours un pb aussi bien sur IE que sous Mozilla concernant la hateur de ma div...

la div 1 est de hauteur minimale 500px

la div 2 est à l'intérieur de celle ci est mesure 100% ou inherit (même résultat)

la div 2 mesurera alors 500px.

Le problème est que ci la div 1 mesure plus de 500px, la div 2 ne mesurera toujours que 500px...comment y remédier ? :hypocrite:

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

LaurentDenis

Posté
Posté
Bon mon problème ne va pas être facile à régler vu que pour des questions technique, je ne peux pas vous donner le CSS que j'utilise (peut-être plus tard).

A lire ce sujet, il est tout simplement impossible de savoir au bout du compte quelle solution exacte tu as retenue, avec quelle syntaxe, quelle erreur éventuelle, quelles possibilités à exploiter, etc.

Avoir à deviner ton code avant de pouvoir t'aider complique inutilement les choses et n'encourage pas à intervenir.

Merci de faire un effort de précision.

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
 Partager
Aller sur la liste des sujets
×
×
  • Créer...