Positionner correctement footer
Fermé
txiki
Messages postés
6596
Date d'inscription
mercredi 30 janvier 2002
Statut
Contributeur
Dernière intervention
22 février 2024
-
22 avril 2008 à 09:57
Dalida Messages postés 6728 Date d'inscription mardi 14 mai 2002 Statut Contributeur Dernière intervention 11 janvier 2016 - 22 avril 2008 à 11:46
Dalida Messages postés 6728 Date d'inscription mardi 14 mai 2002 Statut Contributeur Dernière intervention 11 janvier 2016 - 22 avril 2008 à 11:46
A voir également:
- Positionner correctement footer
- Positionner des points sur une carte - Guide
- Chrome ne s'est pas correctement arrêté ✓ - Forum Google Chrome
- La page n’est pas redirigée correctement ✓ - Forum Mozilla Firefox
- La fenetre actuelle est trop petite pour afficher correctement cette feuille - Forum Google Docs
- Empêcher le message "Restaurer les pages? chrome ne s'est..." - Forum Google Chrome
2 réponses
Dalida
Messages postés
6728
Date d'inscription
mardi 14 mai 2002
Statut
Contributeur
Dernière intervention
11 janvier 2016
921
22 avril 2008 à 10:20
22 avril 2008 à 10:20
salut,
il faut faire sauter le {position:absolute;} sur <div#banner> et <div#content>, tu les sors du flux de positionnement donc le navigateur ne tient pas compte d'eux au moment de représenter le pied de page.
par ailleurs, pour ta bannière il faut ajouter du contenu et mieux vaut éviter de mettre des accents aux attributs :
tu décales tous les autres titres d'un niveau et tu mets la bannière en page comme ça :
et pour ce bout
<div> est aussi de type bloc, il est plus utile d'utiliser un <p> pour mettre du texte, pour la hauteur il faut supprimer les marges au <p> :
il faut faire sauter le {position:absolute;} sur <div#banner> et <div#content>, tu les sors du flux de positionnement donc le navigateur ne tient pas compte d'eux au moment de représenter le pied de page.
par ailleurs, pour ta bannière il faut ajouter du contenu et mieux vaut éviter de mettre des accents aux attributs :
<div id="banniere"> <h1>Titre du document</h1> </div>
tu décales tous les autres titres d'un niveau et tu mets la bannière en page comme ça :
div#banniere h1{
margin:5px 0 10px 0;
display:block;
text-indent:-1000em;
overflow:hidden;
height:100px;
width:790px; /* plus large que <body> ??? */
background-image:url(../Images/bandeau_terre.gif);
background-position:0 0;
background-repeat:no-repeat;
}
et pour ce bout
<div class="date"><!-- on utilise un plutôt qu'un p à cause de la petite hauteur (p est de type bloc) -->
<div> est aussi de type bloc, il est plus utile d'utiliser un <p> pour mettre du texte, pour la hauteur il faut supprimer les marges au <p> :
p{
margin:0;
}
Dalida
Messages postés
6728
Date d'inscription
mardi 14 mai 2002
Statut
Contributeur
Dernière intervention
11 janvier 2016
921
22 avril 2008 à 11:02
22 avril 2008 à 11:02
pour le <p> c'est les marges par défaut définies dans la feuille de style par défaut du navigateur.
pour le menu, il faut qu'il soit en {position:absolute;} pour son fonctionnement, ok.
donc tu laisses le {position:absolute;}, il a comme référence de positionnement son premier ascendant (conteneur) qui a {position:relative;} ou <body> si aucun ascendant avec {position:relative;}.
pour le moment il se réfère aux propriétés de <body> ('left', 'top') pour se positionner et c'est ce qui met le bronx dans ta mise en page.
tu peux annuler ce comportement en mettant ton menu dans un <div> auquel tu appliques {position:relative;} et tu positionnes le menu dans la page en positionnant ce <div> (sans doute un flottement gauche).
voili, voila, bon courage pour la suite et bon week end !
-;o)
(et le lien du site de ta cop's est raide mort…)
pour le menu, il faut qu'il soit en {position:absolute;} pour son fonctionnement, ok.
donc tu laisses le {position:absolute;}, il a comme référence de positionnement son premier ascendant (conteneur) qui a {position:relative;} ou <body> si aucun ascendant avec {position:relative;}.
pour le moment il se réfère aux propriétés de <body> ('left', 'top') pour se positionner et c'est ce qui met le bronx dans ta mise en page.
tu peux annuler ce comportement en mettant ton menu dans un <div> auquel tu appliques {position:relative;} et tu positionnes le menu dans la page en positionnant ce <div> (sans doute un flottement gauche).
voili, voila, bon courage pour la suite et bon week end !
-;o)
(et le lien du site de ta cop's est raide mort…)
txiki
Messages postés
6596
Date d'inscription
mercredi 30 janvier 2002
Statut
Contributeur
Dernière intervention
22 février 2024
517
22 avril 2008 à 11:34
22 avril 2008 à 11:34
Ah ben ouais ! pourtant il marchait tout à l'heure ?
Dalida
Messages postés
6728
Date d'inscription
mardi 14 mai 2002
Statut
Contributeur
Dernière intervention
11 janvier 2016
921
>
txiki
Messages postés
6596
Date d'inscription
mercredi 30 janvier 2002
Statut
Contributeur
Dernière intervention
22 février 2024
22 avril 2008 à 11:46
22 avril 2008 à 11:46
ah ce prix là on va pas enguirlander l'hébergeur quand même !
22 avril 2008 à 10:45
pour la hauteur il faut supprimer les marges au <p> :
p{
margin:0;
}
ça, je ne savais pas. Et la css c'est une fille qui l'a faite en suivant les cours sur le site du zéro (15 jours) alors qu'elle n'y connaissait absolument rien !
Je l'ai un peu tuyauté mais c'est tout.
==> Si je fais cela, les menus ne fonctionnent plus. ça, je ne comprends pas non plus. J'avais utilisé une méthode d'Alsacréation en englobant tous les div par un div container. Et ça, ça ne fonctionne pas.
Je vais tester dès ce soir ta méthode (tu a certainement raison !).
Merci infiniment en tous cas.
le site de la fille se trouve provisoirement à: http://natld.free.fr
Mais sans menu dynamique. Moi, je veux lui montrer comment intégrer un menu via php. On se voit ce week end pour ça.