Problème pour insertion "pied de page"

Général
1

Bonjour tout le monde,

Je réalise actuellement le site Intranet d'une société avec SPIP, je dois
insérer un pied de page avec les coordonnées de l'entreprise comme vous pouvez
le voir sur ce site www.teleca.com .

Le problème est que ce pied de page doit pouvoir varier dans sa position, c'est
à dire qu'en fonction de la taille ( height ) d'une rubrique il devra se
positionner differement, toujours en dessous du contenu. Mais malheureusement
après plusieurs jours de recherche je n'arrive pas à ce résultat il reste en
position fixe et donc empiète sur mon contenu.

Voici le code :

- Description de l'id dans mon fichier .css :

#pied { /* pied de page */
  position: absolute;
  left: 0px;
  background-color: #008283;
  color: white;
  padding-left: 15px;
  padding-right: 15px;
  padding-bottom: 1px;
  margin-bottom:5px;
  width: 769px;
  text-align: center;
  font-size:75%;
  top:650px;
}

- Placement du pied de page dans rubrique.html :

<div id="contenu">

....

<div id="pied">Site de d&eacute;monstration. Texte exp&eacute;rimental.
Ceci n'est pas le site Intranet de Teleca Solutions</div>

....

</div>

2

Je tiens tout de même à signaler qu'en l'occurence ici #pied est en
postion "absolute" mais même si il est en "relative" le problème
reste le même, le placement diffère mais le problème est toujours là.

3

salut ce que je ne comprends pas dans ton div c'est où se situe le div qui contient ce qui précède le pied de page

tu devrais pas avoir un truc du genre :

<div id="contenu">

<div id="corps de texte">
</div>

....

<div id="pied">Site de d&eacute;monstration. Texte exp&eacute;rimental.
Ceci n'est pas le site Intranet de Teleca Solutions</div>

....

</div>

avec une structure pareil ça devrait marcher sinon enlèves le position absolute de ton div pied de page et essayes un margin bottom de quelques pixels

tiens nous au courant

salut

bruno

Le mai , à 9:18, Mattt a écrit :

Bonjour tout le monde,

Je réalise actuellement le site Intranet d'une société avec SPIP, je dois
insérer un pied de page avec les coordonnées de l'entreprise comme vous pouvez
le voir sur ce site www.teleca.com .

Le problème est que ce pied de page doit pouvoir varier dans sa position, c'est
à dire qu'en fonction de la taille ( height ) d'une rubrique il devra se
positionner differement, toujours en dessous du contenu. Mais malheureusement
après plusieurs jours de recherche je n'arrive pas à ce résultat il reste en
position fixe et donc empiète sur mon contenu.

Voici le code :

- Description de l'id dans mon fichier .css :

#pied { /* pied de page */
  position: absolute;
  left: 0px;
  background-color: #008283;
  color: white;
  padding-left: 15px;
  padding-right: 15px;
  padding-bottom: 1px;
  margin-bottom:5px;
  width: 769px;
  text-align: center;
  font-size:75%;
  top:650px;
}

- Placement du pied de page dans rubrique.html :

<div id="contenu">

....

<div id="pied">Site de d&eacute;monstration. Texte exp&eacute;rimental.
Ceci n'est pas le site Intranet de Teleca Solutions</div>

....

</div>

_______________________________________________
liste spip
spip@rezo.net - désabonnement : spip-off@rezo.net
Infos et archives : http://listes.rezo.net/mailman/listinfo/spip
Documentation de SPIP : http://www.spip.net/
irc://irc.freenode.net/spip

4

Bonjour,

Essai une position relative à la place d'une position absolute dans le css
et dis nous ce qui se passe...
Autre chose, est tu obligé de l'inclure dans la balise "contenu" ?

bonne journée !
dom

----- Original Message -----
From: "Mattt" <familyboutin@wanadoo.fr>
To: <spip@rezo.net>
Sent: Friday, May 07, 2004 9:18 AM
Subject: [Spip] Problème pour insertion "pied de page"

Bonjour tout le monde,

Je réalise actuellement le site Intranet d'une société avec SPIP, je dois
insérer un pied de page avec les coordonnées de l'entreprise comme vous
pouvez
le voir sur ce site www.teleca.com .

Le problème est que ce pied de page doit pouvoir varier dans sa position,
c'est
à dire qu'en fonction de la taille ( height ) d'une rubrique il devra se
positionner differement, toujours en dessous du contenu. Mais
malheureusement
après plusieurs jours de recherche je n'arrive pas à ce résultat il reste en
position fixe et donc empiète sur mon contenu.

Voici le code :

- Description de l'id dans mon fichier .css :

#pied { /* pied de page */
position: absolute;
left: 0px;
background-color: #008283;
color: white;
padding-left: 15px;
padding-right: 15px;
padding-bottom: 1px;
margin-bottom:5px;
width: 769px;
text-align: center;
font-size:75%;
top:650px;
}

- Placement du pied de page dans rubrique.html :

<div id="contenu">

....

<div id="pied">Site de d&eacute;monstration. Texte exp&eacute;rimental.
Ceci n'est pas le site Intranet de Teleca Solutions</div>

....

</div>

----------------------------------------------------------------------------
----

_______________________________________________
liste spip
spip@rezo.net - désabonnement : spip-off@rezo.net
Infos et archives : http://listes.rezo.net/mailman/listinfo/spip
Documentation de SPIP : http://www.spip.net/
irc://irc.freenode.net/spip

_____________________________________________________________________
Envie de discuter en "live" avec vos amis ? Télécharger MSN Messenger
http://www.ifrance.com/_reloc/m la 1ère messagerie instantanée de France

5

Bonjour,

Je réalise actuellement le site Intranet d'une société avec SPIP, je dois
insérer un pied de page avec les coordonnées de l'entreprise comme vous

pouvez

le voir sur ce site www.teleca.com .

C'est un site sous SPIP ? Je n'en ai pas eu l'impression. Confirme-moi que
je suis mauvaise langue.

6

Celui n'est pas sous SPIP je mettais juste l'exemple pour vous montrer ce que
devait donner le pied de page :wink:

7

Moi, mon avis, c'est qu'il ne faut pas utiliser de positions absolues.

Tu fais une structure du genre:
<div id="entete">
tu ne spécifies que height
</div>

<div id="principal">
  <div id="col_gauche">
  float:left; + width fixe
  </div>

  <div id="col_droite">
  float:right; + width fixe
  </div>

  <div id="col_milieu">
  tu mets les marges droites et gauche en fonction de width pour tes deux autres colonnes
  </div>
</div>

<div id="cleaner">
.cleaner {
clear:both;
height:1px;
font-size:1px;
border:none;
margin:0;
padding:0;
}
</div>

<div id="pied">
les propriétés que tu veux.
</div>

Avec ce cleaner tu reprends le flux normal de ta page, c-a-d vertical (avant tu étais en flottant --> horizontal). En fait, chacune de tes 3 colonnes va pousser le cleaner vers le bas en fonction de leur contenu, donc le pied aussi.

Après, tu adaptes le reste si tu as besoin de faire exactement la mise en page de teleca machinchose.
Du genre

div principal

  div gauche avec marge à droite pour laisser de la place à la grande colonne

    div entete gauche

    div contenu 3 colonne

      div col gauche (float left)

      div col droite (float right)

      div col milieu (marges en fonction tailles des précédentes)

  div droit flottant (grande colonne)

div cleaner

div pied

Ca devrait marcher, ou presque :wink:
Tu n'as pas besoin de positions absolues pour ce que tu veux faire normalement. Enfin, c'est mon avis.

Le problème est que ce pied de page doit pouvoir varier dans sa
position, c'est
à dire qu'en fonction de la taille ( height ) d'une rubrique il devra se
positionner differement, toujours en dessous du contenu. Mais
malheureusement
après plusieurs jours de recherche je n'arrive pas à ce résultat
il reste en
position fixe et donc empiète sur mon contenu.

Voici le code :

- Description de l'id dans mon fichier .css :

#pied { /* pied de page */
  position: absolute;
  left: 0px;
  background-color: #008283;
  color: white;
  padding-left: 15px;
  padding-right: 15px;
  padding-bottom: 1px;
  margin-bottom:5px;
  width: 769px;
  text-align: center;
  font-size:75%;
  top:650px;
}

- Placement du pied de page dans rubrique.html :

<div id="contenu">

....

<div id="pied">Site de d&eacute;monstration. Texte exp&eacute;rimental.
Ceci n'est pas le site Intranet de Teleca Solutions</div>

....

</div>

8

Merci beaucoup de ton aide je vais essayer ca :wink: