Bonjour,
Tout d’abord je vous félicite pour ce site et notamment la partie tutoriels…
Je suis un apprenti webmaster et je me fais la main sur un petit site.
Pour cela j’ai récupéré un gabarit CSS sur le présent site (merci alsacréations !) que j’ai ensuite personnalisé.
Les balises html utilisées sont des div id.
Le site est basé sur un conteneur d’une largeur de 750 pixels contenant un header de 100 pixels. Juste en dessous, il y a une barre de menu horizontale de 20 pixels de haut. Dessous il y a un menu à gauche et un autre à droite qui font tous les deux 150 pixels de large sur 300 de haut. Les menus encadrent la zone centrale de 300 pixels de haut à laquelle j’ai affecté un ascenseur. Enfin en bas il y a un petit pied de page de 20 pixels de haut.
Il s’agit d’un site « graphique » dans la mesure où ses dimensions doivent rester fixes car liées à une image de fond que je ne souhaite pas déformer.
C’est justement à cause de cet arrière plan que j’ai un problème. Voilà ce que j’ai fait :
J’ai préparé une image de fond entière au dimension globale de mon site (750*440 px). Ensuite j’ai découpé l’image en fonction de mes différents blocs. Ensuite j’ai inséré chacune de mes parties d’images via les règles de style correspondant à mes différents div.
Cela a très bien fonctionné, du moins sous Firefox (v.2). Mais pas sous Internet Explorer (v. 6 et 7). Le problème sous I.E était que le background situé dans ma zone centrale bougeait en même temps que l’ascenseur.
J’ai fait des recherches sur Internet pour solutionner ce problème et j’ai vu qu’il fallait rajouter la valeur « fixed » à la propriété background au niveau des CSS. Mais il semble que cette propriété ne soit pas reconnue sous Internet Explorer. Au début j’ai cru que ça ne concernait que la version 6 mais il s’est avéré que l’arrière plan bougeait aussi avec la version 7.
Depuis une semaine j’écume quotidiennement différents sites et forum. J’ai constaté que ce problème de background fixed lié à un scroll était bien connu. J’ai testé de nombreuses combinaisons différentes mais rien à faire, j’ai toujours ce problème d’affichage avec Internet Explorer…
Hier j’ai testé une nouvelle bidouille… J’ai lu que I.E ne reconnaissait pas la propriété fixed du background au niveau des div id mais au niveau du body. J’ai donc supprimé mon arrière plan au niveau de la règle de mon div id central où il y a le scroll et l’ai mis dans la règle de mon body en paramétrant sa position pour qu’il vienne se caler auniveau de ma zone centrale…
J’ai réussi à aboutir à quelque chose de bien sous Internet Explorer 6 mais cette fois-ci ça a buggué sous Firefox 2…
Là je ne sais plus trop quoi faire. J’ai l’impression que mon code source commence à souffrir de toutes ces combinaisons effectuées…
Je suis un peu perdu… Quelqu’un peut m’aider ?
Voici l’adresse où ça se passe (sachant qu’actuellement la version en ligne est celle où j'ai mis le background dans le body) :
http://moreibiza.free.fr/
Que me conseillez vous de faire ? La bidouille consistant à mettre l’arrière plan qui doit rester fixe dans la règle du body plutôt que du div concerné est elle la bonne voie ?
Merci de votre aide !
manolo
Tout d’abord je vous félicite pour ce site et notamment la partie tutoriels…
Je suis un apprenti webmaster et je me fais la main sur un petit site.
Pour cela j’ai récupéré un gabarit CSS sur le présent site (merci alsacréations !) que j’ai ensuite personnalisé.
Les balises html utilisées sont des div id.
Le site est basé sur un conteneur d’une largeur de 750 pixels contenant un header de 100 pixels. Juste en dessous, il y a une barre de menu horizontale de 20 pixels de haut. Dessous il y a un menu à gauche et un autre à droite qui font tous les deux 150 pixels de large sur 300 de haut. Les menus encadrent la zone centrale de 300 pixels de haut à laquelle j’ai affecté un ascenseur. Enfin en bas il y a un petit pied de page de 20 pixels de haut.
Il s’agit d’un site « graphique » dans la mesure où ses dimensions doivent rester fixes car liées à une image de fond que je ne souhaite pas déformer.
C’est justement à cause de cet arrière plan que j’ai un problème. Voilà ce que j’ai fait :
J’ai préparé une image de fond entière au dimension globale de mon site (750*440 px). Ensuite j’ai découpé l’image en fonction de mes différents blocs. Ensuite j’ai inséré chacune de mes parties d’images via les règles de style correspondant à mes différents div.
Cela a très bien fonctionné, du moins sous Firefox (v.2). Mais pas sous Internet Explorer (v. 6 et 7). Le problème sous I.E était que le background situé dans ma zone centrale bougeait en même temps que l’ascenseur.
J’ai fait des recherches sur Internet pour solutionner ce problème et j’ai vu qu’il fallait rajouter la valeur « fixed » à la propriété background au niveau des CSS. Mais il semble que cette propriété ne soit pas reconnue sous Internet Explorer. Au début j’ai cru que ça ne concernait que la version 6 mais il s’est avéré que l’arrière plan bougeait aussi avec la version 7.
Depuis une semaine j’écume quotidiennement différents sites et forum. J’ai constaté que ce problème de background fixed lié à un scroll était bien connu. J’ai testé de nombreuses combinaisons différentes mais rien à faire, j’ai toujours ce problème d’affichage avec Internet Explorer…
Hier j’ai testé une nouvelle bidouille… J’ai lu que I.E ne reconnaissait pas la propriété fixed du background au niveau des div id mais au niveau du body. J’ai donc supprimé mon arrière plan au niveau de la règle de mon div id central où il y a le scroll et l’ai mis dans la règle de mon body en paramétrant sa position pour qu’il vienne se caler auniveau de ma zone centrale…
J’ai réussi à aboutir à quelque chose de bien sous Internet Explorer 6 mais cette fois-ci ça a buggué sous Firefox 2…
Là je ne sais plus trop quoi faire. J’ai l’impression que mon code source commence à souffrir de toutes ces combinaisons effectuées…
Je suis un peu perdu… Quelqu’un peut m’aider ?
Voici l’adresse où ça se passe (sachant qu’actuellement la version en ligne est celle où j'ai mis le background dans le body) :
http://moreibiza.free.fr/
Que me conseillez vous de faire ? La bidouille consistant à mettre l’arrière plan qui doit rester fixe dans la règle du body plutôt que du div concerné est elle la bonne voie ?
Merci de votre aide !
manolo