Probleme création footer (x)html

Probleme création footer (x)html - Programmation

Recherche Recherche
Règles Règles
Aide Aide

Dans la même thématique :

Ceci répond-il à votre question ? Oui | Non

Voir les posts : Par défaut Tous Les bonnes notes Les notes insuffisantes

Mot : Pseudo : Filtrer
Bas de page
Auteur	Sujet : Probleme création footer (x)html

marc38gt

Profil : IDNaute

Plus d'informations

10-02-2008 à 16:56:56

Bonjour a tous! J'ai un problème de création de pied de page :colere2: .Lorque j'essaie de créer une division tout en bas de ma source, au lieu de s'afficher son contenu en bas de la page, elle l'affiche en bas de la division "corps"(enfin j'en ai l'impression). Si je ne suis pas clair demandez-moi des précisions, et si vous avez des idées pour améliorer le css ou la source n'hésitez pas non plus.

Voici mon code x(html) valide W3C (et franchement inspiré des tutos du SdZ).

Code :

<DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<meta name="Description" content="Bienvenue sur le site de l'info. C'est un site generaliste ou nous publions vos photos,dessins,video..." />
<meta name="keywords" content="kings, roi, king, rois, nouvelles, nouvelle, info, actu, actualite, information, informations, news, new, jeux, flash, marc, remi, trackmania, trackmania nations, humour," />
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-15" />
<meta name="Author" content="Remi, Marco" />
<meta name="copyright" content="kingsdelanews.free.fr" />
<title>Mon super site</title>
<link rel="stylesheet" media="screen" type="text/css" title="Design" href="index3.css" />
<link rel="shortcut icon" type="image/x-icon" href="images/karting.ico" />
</head>
<body>
<p id="en_tete"><img src="images/banierenew.png" alt="" /></p>
<ul id="barre">
<li class="barregauche"><a href="http://kingsdelanews.free.fr/index.php" title="Retournez sur la page d'accueil"><span>Accueil</span></a></li>
<li class="barregauche"><a href="http://kingsdelanews.free.fr/livreor/" title="Laissez un message !"><span>Livre d'or</span></a></li>
<li class="barredroite"><a href="http://kingsdelanews.free.fr/phpBB2/" title="Le forum"><span>Forum</span></a></li>
<li class="barredroite"><a href="wanalester/subscribe.php" title="Le forum"><span>Newsletter</span></a></li>
</ul>
<div id="fond">
<div id="menu">
<div id="menu_dynamique">
<ul>
<li class="extend ">
<a href="#">Vidéo du net</a>
<ul>
<li class="end first"><a href="http://kingsdelanews.free.fr/vactu.php">Actualité</a></li>
<li class="end"><a href="http://kingsdelanews.free.fr/vhumour.php">Humour</a></li>
<li class="end"><a href="http://kingsdelanews.free.fr/vpub.php">Publicité</a></li>
<li class="end last"><a href="http://kingsdelanews.free.fr/vhorreur.php">Horreur</a></li>
</ul>
</li>
<li class="extend">
<a href="#">Vidéo perso</a>
<ul>
<li class="end first"><a href="http://kingsdelanews.free.fr/videoperso/trackmania.php">Trackmania</a></li>
<li class="end"><a href="http://kingsdelanews.free.fr/videoperso/GTA.php">GTA/SAMP</a></li>
<li class="end"><a href="http://kingsdelanews.free.fr/videoperso/pes.php">PES</a></li>
<li class="end last"><a href="http://kingsdelanews.free.fr/videoperso/stepmania.php">Stepmania</a></li>
</ul>
</li>
<li class="extend">
<a href="#">Trackmania</a>
<ul>
<li class="end first"><a href="http://kingsdelanews.free.fr/tmhistoire.php">Histoire</a></li>
<li class="end"><a href="http://kingsdelanews.free.fr/tmtuto.php">Tutoriel</a></li>
<li class="end"><a href="http://kingsdelanews.free.fr/tmconseil.php">Conseil de marco</a></li>
<li class="end last"><a href="http://kingsdelanews.free.fr/tmvideo.php">Vidéo</a></li>
</ul>
</li>
<li class="extend">
<a href="#">Stepmania</a>
<ul>
<li class="end first"><a href="http://kingsdelanews.free.fr/stepmania/stepmania.php">Présentation</a></li>
<li class="end"><a href="http://kingsdelanews.free.fr/stepmania/sconnec.php">Multi-joueur</a></li>
<li class="end"><a href="http://kingsdelanews.free.fr/stepmania/sspeed.php">Modifier la vitesse</a></li>
<li class="end "><a href="http://kingsdelanews.free.fr/stepmania/stop.php">Les options</a></li>
<li class="end last"><a href="http://kingsdelanews.free.fr/stepmania/slien.php">Lien/Pack</a></li>
</ul>
</li>
<li class="extend">
<a href="http://kingsdelanews.free.fr/predieu.php">Prédieu</a>
<ul>
<li class="end first"><a href="http://kingsdelanews.free.fr/visioneuse.html">BD</a></li>
<li class="end last"><a href="http://kingsdelanews.free.fr/photonormal.php">Les photos</a></li>
</ul>
</li>
<li class="extend">
<a href="#">Les mangas</a>
<ul>
<li class="end first last"><a href="http://d38gto.skyblog.com/">GTO</a></li>
</ul>
</li>
<li class="extend">
<a href="#">Les images</a>
<ul>
<li class="end first"><a href="http://kingsdelanews.free.fr/diapo/diapo/">Les images</a></li>
<li class="end last"><a href="mailto:marc38gt@hotmail.fr?subject=Une_image">Envoyez-les-moi</a></li>
</ul>
</li>
<li class="extend">
<a href="#">Les tutoriels</a>
<ul>
<li class="end first"><a href="http://kingsdelanews.free.fr/tuto/audacity.php">Audacity</a></li>
<li class="end" ><a href="http://kingsdelanews.free.fr/tutovideo/tutovideo.php">Créer ses vidéos</a></li>
<li class="end last"><a href="http://kingsdelanews.free.fr/tuto/emulateur.php">Emulateur</a></li>
</ul>
</li>
<li class="end"><a href="http://kingsdelanews.free.fr/lol1.php">Les flash</a></li>
<li class="end "><a href="http://kingsdelanews.free.fr/jeux.php">Jeux perso</a></li>
</ul>
</div>
<iframe src="http://www.i-tchat.com/shoutbox/shoutbox.php?idShoutbox=45190" width="170px" height="350px" frameborder="0"></iframe>
<script src="http://kingsdelanews.free.fr/livreor/boiteJava/?n=1" type="text/javascript"></script>
<br/>
<div style="background-image:url('http://kingsdelanews.free.fr/images/hautimagehasard.png');background-repeat:no-repeat;height: 35px;"></div>
<div style="border-top: 0px 0;border-bottom: 0px 0;background-image: url('http://kingsdelanews.free.fr/images/fondmessage.png');margin-left:0px;">
<a href="/diapo/diapo/?img=2"><img alt="XD" src="/diapo/diapo/getimg.php?img=Les_gifs_a_Marco/XD.gif" style="border:none;max-width:170px;display:block;clear:both;margin-left:auto;margin-right:auto;paddin-top:15px;"/></a><br />
</div>
<img src="http://kingsdelanews.free.fr/images/basimagehasard.png" alt="" />
</div>
<div id="corps">
<div style="margin-bottom:15px;margin-top:25px;padding-left:97px;">
<div class="hautnews">
<div style="background-image: url(images/hautnews.png) ;height:100px;background-repeat:no-repeat;"/></div>
<div class="fondnews" style="width:660px; margin: 0px 0;">
<div style="margin-left:60px;"><strong>Juste un petit tes pour les liens rss :)</strong></div>
<div style="text-align:justify; padding:3px; margin-top:3px; margin-bottom:5px; border-top:1px solid #bd6d2e;margin-left:60px;margin-right:60px;border-collapse: collapse;">Juste un petit tes pour les liens rss :). Et puis pour dire que le site va très peu avancer jusqu'aux vancances XD</div>
<img src="http://kingsdelanews.free.fr/images/bordure.png" alt="" style="margin-left:60px"/>
<span style="float: right;margin-right:60px;"> <a href="#" onclick="window.open('http://kingsdelanews.free.fr/cutenews/show_news.php?subaction=showcomments&template=&id=1201279162&archive=&start_from=&ucat=', '_News', 'HEIGHT=400,WIDTH=650,resizable=yes,scrollbars=yes');return false;">0 Commentaires</a></span>
<div style="margin-left:60px;"><em>Poste le 25 Jan 2008 par <a href="mailto:marc38gt@hotmail.fr">marco</a></em></div>
<div><img src="http://kingsdelanews.free.fr/images/basnews.png" alt=""/></div>
</div><div class="hautnews">
<div style="background-image: url(images/hautnews.png) ;height:100px;background-repeat:no-repeat;"/></div>
<div class="fondnews" style="width:660px; margin: 0px 0;">
<div style="margin-left:60px;"><strong>Mise a jour v0.4</strong></div>
<div style="text-align:justify; padding:3px; margin-top:3px; margin-bottom:5px; border-top:1px solid #bd6d2e;margin-left:60px;margin-right:60px;border-collapse: collapse;">Mise en place du menu en flash;<br />Le lecteur mp3 reste en bas a gauche de votre écran;<br />Le bas de page est à la même hauteur, ça parait simple hein <img style="border: none;" alt="laughing" src="http://kingsdelanews.free.fr/cutenews/data/emoticons/laughing.gif" /> mais non c'est pas simle quand on part de zéro <img style="border: none;" alt="tongue" src="http://kingsdelanews.free.fr/cutenews/data/emoticons/tongue.gif" />;<br />A venir changement de couleur etcc si rem's se décide a finir le header <img style="border: none;" alt="smile" src="http://kingsdelanews.free.fr/cutenews/data/emoticons/smile.gif" />;<br />enfin voila bonne nanée na tous!!!</div>
<img src="http://kingsdelanews.free.fr/images/bordure.png" alt="" style="margin-left:60px"/>
<span style="float: right;margin-right:60px;"> <a href="#" onclick="window.open('http://kingsdelanews.free.fr/cutenews/show_news.php?subaction=showcomments&template=&id=1199994708&archive=1199994713&start_from=&ucat=', '_News', 'HEIGHT=400,WIDTH=650,resizable=yes,scrollbars=yes');return false;">0 Commentaires</a></span>
<div style="margin-left:60px;"><em>Poste le 10 Jan 2008 par <a href="mailto:marc38gt@hotmail.fr">marco</a></em></div>
<div><img src="http://kingsdelanews.free.fr/images/basnews.png" alt=""/></div>
</div><div class="hautnews">
<div style="background-image: url(images/hautnews.png) ;height:100px;background-repeat:no-repeat;"/></div>
<div class="fondnews" style="width:660px; margin: 0px 0;">
<div style="margin-left:60px;"><strong>MaJ v0.3</strong></div>
<div style="text-align:justify; padding:3px; margin-top:3px; margin-bottom:5px; border-top:1px solid #bd6d2e;margin-left:60px;margin-right:60px;border-collapse: collapse;">Alors donc pour cette mise a jour, tous les bugs ont été supprimés.<img style="border: none;" alt="laughing" src="http://kingsdelanews.free.fr/cutenews/data/emoticons/laughing.gif" /><br />Le menu n'est plus déroulant (en prévision pour la grande MaJ graphique <img style="border: none;" alt="wink" src="http://kingsdelanews.free.fr/cutenews/data/emoticons/wink.gif" /> . <br />Pour les vidéos il y a du changement, uploader les sur dailymotion et contactez-moi pour les mettre dans une playlist.<br />Voila voila <img style="border: none;" alt="tongue" src="http://kingsdelanews.free.fr/cutenews/data/emoticons/tongue.gif" />!</div>
<img src="http://kingsdelanews.free.fr/images/bordure.png" alt="" style="margin-left:60px"/>
<span style="float: right;margin-right:60px;"> <a href="#" onclick="window.open('http://kingsdelanews.free.fr/cutenews/show_news.php?subaction=showcomments&template=&id=1198345272&archive=1199994713&start_from=&ucat=', '_News', 'HEIGHT=400,WIDTH=650,resizable=yes,scrollbars=yes');return false;">0 Commentaires</a></span>
<div style="margin-left:60px;"><em>Poste le 22 Dec 2007 par <a href="mailto:marc38gt@hotmail.fr">marco</a></em></div>
<div><img src="http://kingsdelanews.free.fr/images/basnews.png" alt=""/></div>
</div><div style="margin-top:15px;width:100%;text-align:center;font:9px Verdana;">Content Management Powered by <a href="http://cutephp.com/" title="CuteNews - PHP News Management System">CuteNews</a></div>
</div>
<a title="RSS Feed" href="http://kingsdelanews.free.fr/cutenews/rss.php?number=10">
<img src="http://kingsdelanews.free.fr/cutenews/skins/images/rss_icon.gif" alt="rss" style="border:0 none;" />
</a>
<a href="http://validator.w3.org/check?uri=referer"><img
src="http://www.w3.org/Icons/valid-xhtml10"
alt="Valid XHTML 1.0 Transitional" height="31" width="88" style="border:0 none;"/></a>
<a title="Mettre ce site dans vos Favoris" href="javascript:window.external.addfavorite('http://kingsdelanews.free.fr/index.php', 'kingsdelanews')"><img src="images/coeur.png" alt="" style="border:0 none;"/></a>
<span style="position:relative;right:0px;bottom:0px;">
0.0832 s.</span>
</div>
</div>
<div style="position:fixed;bottom:0px;left:0px;"><object type="application/x-shockwave-flash" data="dewplayer-multi.swf?mp3=mp3/opgap.mp3|mp3/foy.mp3|mp3/max.mp3&random=1&bgcolor=ffbd89" width="240" height="20"><param name="movie" value="dewplayer-multi.swf?mp3=mp3/opgap.mp3|mp3/foy.mp3|mp3/max.mp3&random=1&bgcolor=ffbd89" /></object><a href="dewplayer-multi.swf?mp3=mp3/max.mp3|mp3/foy.mp3|mp3/opgap.mp3&random=1&bgcolor=ffbd89" onclick="window.open(this.href, 'radio', 'width=240, height=20, toolbar=no, menubar=no, location=no, resizable=yes, scrollbars=no, status=no'); return false;"><b style="color:red;font-size:8px;text-decoration: none;">Pop-up</b></a></div>
</body>
</html>

Et voici mon code CSS

Code :

body {
width : 1024px;
margin : auto;
margin-top : 20px;
margin-bottom : 20px;
background-image : url(http://kingsdelanews.free.fr/images/home.png);
background-repeat : repeat;
background-attachment : fixed;
font-family : "Trebuchet MS", serif;
border-bottom : 2px solid gray;
behavior:url("http://kingsdelanews.free.fr/css/csshover.htc" );
}
#en_tete {
text-align : center;
margin-top : 5px;
}
#barre {
list-style-type : none;
margin : 0;
padding : 0;
padding-left : 0;
height : 25px;
background-color : #f3a05f;
border : 1px solid gray;
}
.barregauche {
float : left;
padding-left : 8px;
background : url(http://kingsdelanews.free.fr/images/sepa2.png) no-repeat right 0%;
padding-right : 15px;
}
.barredroite {
float : right;
padding-left : 20px;
background : url(http://kingsdelanews.free.fr/images/sepa.png) no-repeat;
padding-right : 8px;
}
#speedbarre li {
height : 25px;
line-height : 25px;
text-align : center;
padding-top : 0;
}
#barre a {
color : white;
font-style : normal;
text-decoration : none;
font-weight : bold;
display : block;
}
#barre a:hover {
color : #b3b3b3;
}
#fond {
background : url(http://kingsdelanews.free.fr/images/fond.png) center 0;
overflow : auto;
}
dl, dt, dd, ul {
list-style-type : none;
}
#menu {
float : left;
width : 170px;
background-color : #ffbd89;
border-right : 1px solid gray;
border-left : 2px solid gray;
border-right : 2px solid gray;
}
#menu_dynamique li a {
display : block;
height : 25px;
text-decoration : none;
color : #696969;
background-color : #ffbd89;
}
#menu_dynamique {
width : auto;
margin : 0 0;
padding : 0;
}
#menu_dynamique ul {
width : 170px;
list-style : none;
padding : 0;
margin : 0;
border-right : 1px solid silver;
}
#menu_dynamique ul li {
width : auto;
margin-left : 0;
padding-left : 25px;
text-indent : 5px;
height : 25px;
background : url("http://kingsdelanews.free.fr/menu/bordure.png" ) no-repeat;
}
#menu_dynamique ul li ul {
display : none;
}
#menu_dynamique ul li:hover ul {
display : block;
position : relative;
top : -25px;
left : 146px;
}
#menu_dynamique ul li ul, #menu_dynamique ul li:hover ul li ul, #menu_dynamique ul li:hover ul li:hover ul li ul {
display : none;
}
#menu_dynamique ul li:hover ul, #menu_dynamique ul li:hover ul li:hover ul, #menu_dynamique ul li:hover ul li:hover ul li:hover ul {
display : block;
position : relative;
top : -25px;
left : 146px;
}
#menu_dynamique ul li.extend a {
background : #ffbd89 url("http://kingsdelanews.free.fr/menu/suite.gif" ) right no-repeat;
}
#menu_dynamique ul li.extend:hover ul li.end a {
background-image : none;
}
#menu_dynamique li:hover {
background : url("http://kingsdelanews.free.fr/menu/fleche_survol.png" ) no-repeat;
}
#menu_dynamique li a:hover {
color : black;
background-color : #bbb7c7;
}
#menu_dynamique ul li.extend:hover a, #menu_dynamique ul li.extend:hover ul li:hover a, #menu_dynamique ul li.extend:hover ul li.extend:hover ul li:hover a, #menu_dynamique ul li.extend:hover ul li.extend:hover ul li.extend:hover ul li:hover a {
background-color : #bbb7c7;
}
#menu_dynamique ul li.extend:hover ul li a, #menu_dynamique ul li.extend:hover ul li:hover ul li a, #menu_dynamique ul li.extend:hover ul li.extend:hover ul li:hover ul li a {
background-color : #ffffff;
}
#menu_dynamique li.first {
border-top : 1px solid silver;
}
#menu_dynamique li.last {
border-bottom : 1px solid silver;
}
html > body #menu_dynamique ul li.extend:hover {
overflow : visible;
}
#corps {
margin-right : 0;
border-right : 2px solid gray;
border-left : 1px solid gray;
padding-bottom : 5px;
color : black;
background-color : #ffbd89;
float : right;
width : 847px;
margin-top : 0;
}
.hautnews {
margin-top : 20px;
margin-bottom : 20px;
}
.fondnews {
background-image : url(http://kingsdelanews.free.fr/images/fondnews.png);
margin-right : 50px;
color : black;
}

Merci d'avance

Message édité par OmaR_ShaRif le 11-02-2008 à 12:41:34

Liens

OmaR_ShaRi f

™
Profil : Extensionaute

Plus d'informations

11-02-2008 à 12:42:22

Masquer

Salut,

Tout dans ton site est positionné en absolute, donc, quand ton corps est beaucoup plus grand que prévu, ton footer se retrouve au même niveau que ton corps.

---------------
==> Créez votre brute et défiez OmaR_ShaRif <==
Un adulte est un grand enfant qui croit qu'il sait.
Un enfant est un petit adulte qui sait qu'il croit.

Aller à :

FORUM Infos-du-Net » Programmation » Probleme création footer (x)html

Page générée en 0.657 secondes

Liens

Messages similaires

Dans l'actualité

Les téléchargements

Les dernières actualités

Les derniers dossiers