Incidence image sur pied de page
Bonjour,
Je suis en train de refaire un site en utilisant les balise div tel l'exemple ci-dessous :
<div id="topbar"></div>
<div id="toolbar"></div>
<div id="contenu">
<div id="menu1"></div>
<div id="menu2"></div>
</div>
<div id="piedpage"></div>
Toutefois lorsque je mets des images.gif dans le menu2 mon pied de page se décale vers la droite. Je précise que j'ai un calendrier et une horloge dans le menu1 et que cela ne crée aucune incidence sur mon pied de page.
Dans mon fichier.css j'ai bien spécifié pour mon pied de page la programmation suivante :
div#piedpage{
clear:both;
}
Quelqu'un parmi vous pourrait-il m'éclairer s'il vous plaît. Merci par avance pour votre aide.
Anthuriumre
Je suis en train de refaire un site en utilisant les balise div tel l'exemple ci-dessous :
<div id="topbar"></div>
<div id="toolbar"></div>
<div id="contenu">
<div id="menu1"></div>
<div id="menu2"></div>
</div>
<div id="piedpage"></div>
Toutefois lorsque je mets des images.gif dans le menu2 mon pied de page se décale vers la droite. Je précise que j'ai un calendrier et une horloge dans le menu1 et que cela ne crée aucune incidence sur mon pied de page.
Dans mon fichier.css j'ai bien spécifié pour mon pied de page la programmation suivante :
div#piedpage{
clear:both;
}
Quelqu'un parmi vous pourrait-il m'éclairer s'il vous plaît. Merci par avance pour votre aide.
Anthuriumre
Configuration: Windows XP Internet Explorer 7.0
15 réponses
-
et sans le css ?
sinon tu peux décalé vers la gauche avec un margin-left:-10px-
Bonjour Math 2000,
Merci pour ton conseil qui est très judicieux même si j'ai du mettre margin-left:-0px; pour que ce problème soit résolu.
Une question demeure toutefois. Mon pied page reste dans mon contenu alors même qu'il devrait en être indépendant comme il l'était avant que ne n'y mette des images, tout comme mon topbar et toolbar.
dans mon fichier.css la programmation est la suivante s'agissant de mon pied de page:
div#pp{
width:700px;
height:5%;
background-color:red;
margin:0.5% 15% 0.5% 15%;
clear:both;
margin-left:-0px;
}
Avant que je n'insère d'image je le répète, le pied de page s'affichait séparé du contenu.
Merci encore pour ton aide.
A très bientôt. Et encore mille mercis
Anthuriumre
-
-
ça ne serait pas ton clear:both;
qui pose pb -
tu pourrais me passer un zip
-
elle est sur mon profil bormat2@gmail.com
-
bjr
A tout hasard ajoute un div "fictif" pour forcer le clear
<div id="contenu">
<div id="menu1"></div>
<div id="menu2"></div>
</div>
<div class="spacer"></div>
<div id="piedpage"></div>
Et
.spacer {
clear:both;
}
-
je n'ai rien reçu encore
-
Bjr
Bah t'impatiente pas trop car son problème est très certainement lié à une erreur ds le CSS et c'est pas forcément simple à trouver lol ;-) -
c'est prévu pour quel navigateur car c'est différent sous ie6 firefox et opéra si j'ai bien compris
le pied de page doit être en bas
ha au fait dans le chemin image il y a un lien vers une image vers tes document donc inaccessible ici
-
Salutations à Math 2000 et PhP,
PhP a raison il y avait une erreur au niveau de l'orthographe dans mon fichier.css. notamment au niveau du height.
Par contre Math 2000 les navigateurs j'utilise sont IE8 et FF.
Maintenant en tenant compte de ce que tu m'as dis à propos du margin-left cela me permet un affichage correct avec IE8 mais ça décale mon Pp avec FF. Si je ne mets pas le margin-left ça décale dans IE8 et cela s'affiche correctement dans FF.
Comment faire pour qu'il y ait une compatibilité ne serait-ce avec ces deux navigateurs ?
Merci à vous de prendre de votre temps pour m'aider. car à force de chercher je ne vois plus rien.
Cordialement.
-
-
il faut utliser les balise if ie
qui permette de donner du code que à ie
le meilleur affichage de ton site est pour l'instant opéra où tout est aligné
http://www.blog-and-blues.org/articles/Les_syntaxes_de_commentaires_conditionnels_pour_IE_Windows-
Bonjour,
J'ai mis
<!--[if IE]>
margin-left:-0px;
<![endif]-->
Le décalage du pied de page apparaît à nouveau à droite pour IE8 sauf pour FF.
Si je ne mets pas ce bout de code l'affichage du pp est correcte pour IE8 mais se décale pour FF
Je n'y comprends plus rien.
Merci beaucoup Math 2000.
Cordialement
Anthuriumre
-
-
au fait tu devrais aussi testé sous ie6 encore 20% d'utlisateur l'ont
-
tu peux pas mettre un bout de css tous seul il faut
<html><head><!--[if IE]>
.classe de l'oblet qui pose pb (margin-left:-0px;)
<![endif]--> </head>
<body>ta page
objet qui pose pb
</body>
</html -
tu met bien la classe avant ?
-
Bonsoir Math 2000,
J'ai mis entre head et head pour essayer
<html>
<head>
<!--[if IE]>
.pp {margin-left:-0px}
<![endif]-->
</head>
<body>
<div id="pp"></div>
</body>
</html>
ça ne fonctionnait pas. Puis car on ne sait jamais
<html>
<head>
<!--[if IE]>
div#pp {margin-left:-0px}
<![endif]-->
</head>
<body>
<div id="pp"></div>
</body>
</html>
ça ne fonctionnait pas. Puis on ne sait toujours jamais
<html>
<head>
<!--[if IE]>
div id="pp" {margin-left:-0px}
<![endif]-->
</head>
<body>
<div id="pp"></div>
</body>
</html>
ça ne fonctionnait pas. Comment dois-je m'y prendre. Ai-je omis quelque chose ?
Merci.
-
-
dans le 1er essaie tu as mis un . au lieu d'un #
les points pour les classe et les " pour les id
sinon qu'est ce que ça fait si tu modifie la valeur du margin left -
Houlà du CSS conditionnel maintenant !
Je savais bien que ça serait pas simple cette histoire de pied de page T'Oh
Un truc que je fais quand tout à échouer : je repars d'une page HTML vide avec la même feuille de style et je rajoute les blocs de balise un à un jusqu'à ce que je retrouve l'erreur. C'est long et pénible mais bon
Ah oui sans oublier d'utiliser la console d'erreur de FF ;-)
Bon courage qd même-
Bonjour PhP,
C'est vrai que les css conditionnels ne sont pas recommandés mais c'est fastidieux de toujours recommencer. Et qui plus est il faut aussi essayer toutes les possibilités quand elles peuvent exister. Merci pour tes conseils. Si au travers des conditionnels on arrive pas à trouver la solution je pense que je recommencerai comme toi même tu le fais.
Merci encore
Cordialement
Anthuriumre
-
-
bon ven si tu as tous fais il ne reste plus que la position absolute
où d'enlever ta barre et la refaire
