Sujet Précédent Sujet Suivant

Pied de page html

Fermé
Loic - 6 août 2012 à 15:38
 Loic - 7 août 2012 à 15:08
Bonjour a tous,

Je n'arrive pas a mettre le footer sur la même ligne:

<div class="footer_legal_notice">
<a href="http://www.test.com" target="_blank"> ©
TEXTE</a> </div>
</div>
<div class="toppage">
<a href="#top">top</a>
</div>


.footer_legal_notice {
font-family: Arial, Helvetica, sans-serif;
font-size: 11px;
font-style: normal;
font-weight: normal;
color: #1A61A9;
bottom: 0;
padding-left:50px;
}

#toppage {
float: right;
text-align: right;
margin-right: 5px;
position:absolute;
bottom : 0px;
right: 240px;
}
J'aimerais qu'il soit tout les 2 sur la même ligne.
Merci.

A voir également:

8 réponses

Réponse 1 / 8
@lobotomix:~# rm -rf *\ Messages postés 1392 Date d'inscription dimanche 1 juillet 2012 Statut Membre Dernière intervention 14 décembre 2012 208
6 août 2012 à 15:44
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>test</title>
<style type="text/css">
.footer_legal_notice {
font-family: Arial, Helvetica, sans-serif;
font-size: 11px;
font-style: normal;
font-weight: normal;
color: #1A61A9;
position: relative;
left: 30px;


}
.toppage {




position: relative;
bottom: 17px;
}
</style>
</head>
<body>
<div class="footer_legal_notice">
<a href="http://www.test.com" target="_blank"> TEXTE</a>
</div>
</div>
<div class="toppage">
<a href="#top">top</a>
</div>
</body>
</html>
0
@lobotomix:~# rm -rf *\ Messages postés 1392 Date d'inscription dimanche 1 juillet 2012 Statut Membre Dernière intervention 14 décembre 2012 208
6 août 2012 à 15:46
pour top page vous avez mi une class alors faut pas mettre un # mais un " . "
0
Loic
6 août 2012 à 15:49
Merci mais cela ne marche pas et pourquoi mettre bottom 17 si ils doivent être tout les 2 en bas de la page.
0
@lobotomix:~# rm -rf *\ Messages postés 1392 Date d'inscription dimanche 1 juillet 2012 Statut Membre Dernière intervention 14 décembre 2012 208
6 août 2012 à 15:53
ha oui c est un pied de page je suis bete...attend
0
Réponse 2 / 8
mimigenie Messages postés 1180 Date d'inscription dimanche 3 janvier 2010 Statut Membre Dernière intervention 4 août 2018 313
6 août 2012 à 15:49
Mets les 2 dans le même block et si tu veux ajouter un style css, utilise la balise span qui à le même effet que div sauf que c'est une balise de type in line.

Donc ca donne :
<p>
<span class="footer_legal_notice">
<a href="http://www.test.com" target="_blank"> ©
TEXTE</a> </span>
<span class="toppage">
<a href="#top">top</a>
</span>
</p>

J'ai rajouté des balises p car tout texte doit être dans un paragraphe.

Attention dans ton css, tu as fais une erreur :

#toppage {

Le # est utilisé quand il s'agit d'un id, mais dans ton cas il faut un . comme tu l'as fait pour footer_legal_notice
0
Réponse 3 / 8
@lobotomix:~# rm -rf *\ Messages postés 1392 Date d'inscription dimanche 1 juillet 2012 Statut Membre Dernière intervention 14 décembre 2012 208
6 août 2012 à 15:57
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>test</title>
<style type="text/css">
.footer_legal_notice {
font-family: Arial, Helvetica, sans-serif;
font-size: 11px;
font-style: normal;
font-weight: normal;
color: #1A61A9;
position: absolute;
bottom: 2px;


}
.toppage {




position: absolute;
bottom: 0px;
left: 50px;
}
</style>
</head>
<body>
<div class="footer_legal_notice">
<a href="http://www.test.com" target="_blank"> TEXTE</a>
</div>
</div>
<div class="toppage">
<a href="#top">top</a>
</div>
</body>
</html>


ou suit les conseil de mimiegenie ils sont intéressant, moi j'ai juste reprit ton code que j'ai modifier
0
@lobotomix:~# rm -rf *\ Messages postés 1392 Date d'inscription dimanche 1 juillet 2012 Statut Membre Dernière intervention 14 décembre 2012 208
6 août 2012 à 16:16
penser a mettre resolu
0
Réponse 4 / 8
Loic
6 août 2012 à 16:28
Ça ne marche toujours pas maintenant le top est partit au milieu complétement a droite.
0
@lobotomix:~# rm -rf *\ Messages postés 1392 Date d'inscription dimanche 1 juillet 2012 Statut Membre Dernière intervention 14 décembre 2012 208
6 août 2012 à 16:38
chez moi ca fonctionne, je comprend pas ya pas plus simple comme code
0
Loic
6 août 2012 à 16:55
Oui c'est bizarre toujours compliquer avec moi...
Enfaite le top il se met en bas de la fenêtre et non en bas de la page.
0
@lobotomix:~# rm -rf *\ Messages postés 1392 Date d'inscription dimanche 1 juillet 2012 Statut Membre Dernière intervention 14 décembre 2012 208
6 août 2012 à 17:20
ha mais je croi comprendre donner tout votre code et ca ira mieux
0
Loic
6 août 2012 à 18:26
</head>
<body>
<div align="center">
<table width="100%" cellspacing="5" cellpadding="0" border="0" class="LeftMenu" style="height: 134px; width: 940px;">


<tr>
<td valign="top">
<div class="postexte">
<h4 class="pos_top">
<br />
</h4>
<h4 class="pos_top">TEXTE. </h4>
</div>
</td>
</tr>
</table>
<div class="float"> <a href="../Version 3/test.html"><img class="image" alt="test" title="test" src="../image/phone.jpeg" /></a>
<a href="../Version 3/test.html"><img class="image" alt="test" title=test" src="../image/haut_sartoux.jpg" /></a>
<a href="../Version 3/test.html"><img class="image" alt="test" title="test" src="../image/antibes.jpg" /></a><br />

<div class="sautl"> <a href="../Version 3/test.html"><img class="image" alt="testt" title="testt" src="../image/eating.jpg" /></a>
<a href="../Version 3/test.html"><img class="image" alt="test" title="Go to Getting arround" src="../image/getaround.png" /></a>
<a href="../Version 3/test.html"><img class="image" alt="test" title="test" src="../image/iconesecu.jpeg" /></a><br />
</div>
</div>
</td>
</tr>
</table>
<div class="footer_legal_notice">
<a target="_blank" href="http://www.test.coml"> © TEXTE</a> </div>
<div class="toppage">
<a href="#top">top</a> </div>
</div>
</body>
</html>
0

Vous n’avez pas trouvé la réponse que vous recherchez ?

Posez votre question
Réponse 5 / 8
@lobotomix:~# rm -rf *\ Messages postés 1392 Date d'inscription dimanche 1 juillet 2012 Statut Membre Dernière intervention 14 décembre 2012 208
6 août 2012 à 18:43
Alors voila ce que je vous propose, avant de vous aidez a positionner vos element comme il faut j'ai passé votre code au validateur w3c et il a 20 erreur et un avertissement. Corriger tout et je vous aiderez

http://validator.w3.org/
0
Loic
6 août 2012 à 19:46
Chez moi je n'ai aucune erreur j'ai sans doute du oublier des balises dans le copier coller.
0
Réponse 6 / 8
Loic
7 août 2012 à 11:49
J'ai réussi en mettent margin-bottom mais je n'arrive pas a mettre le footer a gauche et le "top" a droite.
0
@lobotomix:~# rm -rf *\ Messages postés 1392 Date d'inscription dimanche 1 juillet 2012 Statut Membre Dernière intervention 14 décembre 2012 208
7 août 2012 à 11:50
ok je te la fait attend
0
Réponse 7 / 8
@lobotomix:~# rm -rf *\ Messages postés 1392 Date d'inscription dimanche 1 juillet 2012 Statut Membre Dernière intervention 14 décembre 2012 208
Modifié par @lobotomix:~# rm -rf * le 7/08/2012 à 11:55
alors ne dit pas que ca fonctionne pas car chez moi c est bon 

<!DOCTYPE html> 
<html> 
 <head> 
  <meta charset="utf-8" /> 
  <title>test</title> 
  <style type="text/css"> 
  .footer_legal_notice 
  { 
   position: absolute; 
   bottom: 0px; 
  } 
  .toppage 
  { 
   position: absolute; 
   bottom: 0px; 
   left: 100px; 
  } 
  </style> 
 </head> 
 <body> 
  </head> 
 <body> 
  <div align="center"> 
   <table width="100%" cellspacing="5" cellpadding="0" border="0" class="LeftMenu" style="height: 134px; width: 940px;"> 
    <tr> 
     <td valign="top"> 
     <div class="postexte"> 
      <h4 class="pos_top"> 
      <br /> 
      </h4> 
      <h4 class="pos_top">TEXTE. </h4> 
     </div></td> 
    </tr> 
   </table> 
   <div class="float"> 
    <a href="../Version 3/test.html"><img class="image" alt="test" title="test" src="../image/phone.jpeg" /></a> 
    <a href="../Version 3/test.html"><img class="image" alt="test" title="test" src="../image/haut_sartoux.jpg" /></a> 
    <a href="../Version 3/test.html"><img class="image" alt="test" title="test" src="../image/antibes.jpg" /></a><br /> 

    <div class="sautl"> <a href="../Version 3/test.html"><img class="image" alt="testt" title="testt" src="../image/eating.jpg" /></a> 
    <a href="../Version 3/test.html"><img class="image" alt="test" title="Go to Getting arround" src="../image/getaround.png" /></a> 
    <a href="../Version 3/test.html"><img class="image" alt="test" title="test" src="../image/iconesecu.jpeg" /></a><br /> 
    </div> 
    </div> 
    </td> 
    </tr> 
    </table> 
    <div class="footer_legal_notice"> 
    <a target="_blank" href="http://www.test.coml"> © TEXTE</a> </div> 
    <div class="toppage"> 
    <a href="#top">top</a> </div> 
    </div> 
    </body> 
    </html> 

    </body> 
    </html>


"Un homme azerty en vaut deux"
0
Loic
7 août 2012 à 12:59
Merci mais ça ne marche pas j'arrive a déplacer le footer mais le top reste toujours coller au footer.

.footer_legal_notice {
font-family: Arial, Helvetica, sans-serif;
font-size: 11px;
font-style: normal;
font-weight: normal;
color: #1A61A9;
margin-bottom: 0;
left:100px;
}
.toppage {
font-family: Arial, Helvetica, sans-serif;
text-align: right;
margin-right: 5px;
position:absolute;
margin-bottom : 0px;
right: 200px;
}
0
@lobotomix:~# rm -rf *\ Messages postés 1392 Date d'inscription dimanche 1 juillet 2012 Statut Membre Dernière intervention 14 décembre 2012 208
7 août 2012 à 13:05 
.footer_legal_notice 
  { 
   position: absolute; 
   bottom: 0px; 
  } 
  .toppage 
  { 
   position: absolute; 
   bottom: 0px; 
   left: 100px; 
  }
0
@lobotomix:~# rm -rf *\ Messages postés 1392 Date d'inscription dimanche 1 juillet 2012 Statut Membre Dernière intervention 14 décembre 2012 208
7 août 2012 à 13:07
ou pour simplifier la tache 

.footer_legal_notice { 
font-family: Arial, Helvetica, sans-serif; 
font-size: 11px; 
font-style: normal; 
font-weight: normal; 
color: #1A61A9; 
position: absolute; 
bottom: 0px; 
} 
.toppage { 
font-family: Arial, Helvetica, sans-serif;	 
position: absolute; 
bottom: 0px; 
left: 100px; 

}
0
Loic
7 août 2012 à 13:40
Ca ne marche toujours pas le "top" va aussi a gauche et reste coller au footer.
0
@lobotomix:~# rm -rf *\ Messages postés 1392 Date d'inscription dimanche 1 juillet 2012 Statut Membre Dernière intervention 14 décembre 2012 208
7 août 2012 à 13:43
j'ai rentrer ton code plusieur fois en faisant un copier coller, j'ai fait les modification et ca fonctionne...... :/

je comprend pas quel logiciel utiliser vous?
0
Réponse 8 / 8
@lobotomix:~# rm -rf *\ Messages postés 1392 Date d'inscription dimanche 1 juillet 2012 Statut Membre Dernière intervention 14 décembre 2012 208
7 août 2012 à 12:11
j ai un petit cadeau pour vous c est rapide a lire et c est bien utile
https://openclassrooms.com/fr/courses/1603881-apprenez-a-creer-votre-site-web-avec-html5-et-css3
0

Discussions similaires

waze piétons
ANNY -
bendrop -

2 réponses
la balise <br> ou <br />
faamugol -
rwaness -

8 réponses
GPS pour PIETONS
TIANIS123 -
jpcy -

10 réponses
<br> ou <br /> ou </br>
corentin.93 -
jessy006 -

11 réponses