28172 sujets
CSS et mise en forme, CSS3
Sans me prétendre expert...
Si je comprends bien, lorsque la fenêtre du nav. est réduite l'image du "footer" ne s'affiche pas convenablement.
En simulant ca sur ton site, effectivement on appercoit le fond derrière l'image du bas.
Il semblerait que les propriétés de cette image soit exprimés en pourcentage tandis que ta page centrale a une largeur fixe.
Est ce une piste ?
NB : J'ai pas eu le temps de matter ton css c'est l'heure de miam ^^ D'ici là peut etre qu'un expert pourra te donner son avis
Si je comprends bien, lorsque la fenêtre du nav. est réduite l'image du "footer" ne s'affiche pas convenablement.
En simulant ca sur ton site, effectivement on appercoit le fond derrière l'image du bas.
Il semblerait que les propriétés de cette image soit exprimés en pourcentage tandis que ta page centrale a une largeur fixe.
Est ce une piste ?
NB : J'ai pas eu le temps de matter ton css c'est l'heure de miam ^^ D'ici là peut etre qu'un expert pourra te donner son avis
Petites observations faites sur ton site :
Sous Mozilla 2 :
http://img255.imageshack.us/img255/4331/screenshot167zz8.jpg
Sous IE 6 (depuis le taf ^^) :
http://img527.imageshack.us/img527/4095/screenshot168jf5.jpg
Le décallage de droite visualisé avec Mozilla n'est pas reproduit avec IE. Cependant sous IE, on voit apparaître des bordures grises de part et d'autre de ton bloc central.
Ca te fera pas avancer dans ton problème je sais, mais ca te permettra peut être de trouver une piste
Ce conteneur sert à quoi ?
Modifié par neya (12 Feb 2008 - 11:43)
Sous Mozilla 2 :
http://img255.imageshack.us/img255/4331/screenshot167zz8.jpg
Sous IE 6 (depuis le taf ^^) :
http://img527.imageshack.us/img527/4095/screenshot168jf5.jpg
Le décallage de droite visualisé avec Mozilla n'est pas reproduit avec IE. Cependant sous IE, on voit apparaître des bordures grises de part et d'autre de ton bloc central.
Ca te fera pas avancer dans ton problème je sais, mais ca te permettra peut être de trouver une piste
html :
<div id="site"> ... </div>
CSS :
#site{
}
Ce conteneur sert à quoi ?
Modifié par neya (12 Feb 2008 - 11:43)
D'après ce que j'ai pu voir dans ton html et ton css, il y a des trucs un peu louche. Je pense honnêtement que (comme pour moi ^^) tu vas devoir passer à la casserole (façon de parler bien sûr) et reviser ton découpage et ta façon de créer ton site.
J'essaye d'appuyer mes arguments :
=> Lorsque l'on arrive sur la page principale de ton site, le header est semble-t-il collé à droite. Ceci s'explique par la conception de ton empilage de div et surtout par leurs caractéristiques, décritent dans le css.
=> Personnelement j'aurai bien vu un ensemble homogène centré (header_fond, header, global, global_l, et bottom). Il te faudrai pour cela simplement revoir le découpage de ton header (logo + fond)
=> global_l ne semble servir à rien. La preuve en est que lorsqu'on le retire, rien ne bouge. Ceci dit tu t'en servais en tant que conteneur. La revision de ton css te permettra d'optimisé le tout.
Exemple d'html :
Exemple de css :
C'est une idée bien sûr... le css n'est pas complet du tout, c'etait juste pour t'indiquer une éventuelle piste (en espérant que Flo me mette pas minable en me disant que c'est n'importe quoi XD). J'essaye juste de donner un retour à un forum qui m'apporte beaucoup de chose ^^ (tellement facile de poster puis de se barrer quand on a sa réponse)
Bien sûr, ceci va de paire avec un header de ce style (en repeat), sur lequel tu pourrais superposer ton logo :
http://img162.imageshack.us/img162/9735/screenshot169ky4.jpg
Modifié par neya (12 Feb 2008 - 16:24)
J'essaye d'appuyer mes arguments :
=> Lorsque l'on arrive sur la page principale de ton site, le header est semble-t-il collé à droite. Ceci s'explique par la conception de ton empilage de div et surtout par leurs caractéristiques, décritent dans le css.
=> Personnelement j'aurai bien vu un ensemble homogène centré (header_fond, header, global, global_l, et bottom). Il te faudrai pour cela simplement revoir le découpage de ton header (logo + fond)
=> global_l ne semble servir à rien. La preuve en est que lorsqu'on le retire, rien ne bouge. Ceci dit tu t'en servais en tant que conteneur. La revision de ton css te permettra d'optimisé le tout.
Exemple d'html :
<!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">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>TRAFFIC :: LA REGIE TECHNIQUE</title>
<link rel="stylesheet" href="essai.css" type="text/css" media="screen" />
</head>
<body>
<div id="header"></div>
<div id="global">
<div id="logo"></div>
<div id="centre">...</div>
</div>
<div id="footer">...</div>
</div>
</body>
</html>
Exemple de css :
#header {
background : url(...)repeat-x;
width : 100%;
height : xxpx;
}
#footer {
background : url(...) repeat-x;
width : 100%;
height : xxpx;
}
#global {
position : absolute;
margin-left: auto;
margin-right:auto;
width:900px;
}
#logo {
width: 900px;
height: 150 px;
}
#centre {
width: xxpx;
height: 150 px;
margin-left :
}
C'est une idée bien sûr... le css n'est pas complet du tout, c'etait juste pour t'indiquer une éventuelle piste (en espérant que Flo me mette pas minable en me disant que c'est n'importe quoi XD). J'essaye juste de donner un retour à un forum qui m'apporte beaucoup de chose ^^ (tellement facile de poster puis de se barrer quand on a sa réponse)
Bien sûr, ceci va de paire avec un header de ce style (en repeat), sur lequel tu pourrais superposer ton logo :
http://img162.imageshack.us/img162/9735/screenshot169ky4.jpg
Modifié par neya (12 Feb 2008 - 16:24)