Forum |  HardWare.fr | News | Articles | PC | S'identifier | S'inscrire | Shop Recherche
1548 connectés 

  FORUM HardWare.fr
  Programmation
  HTML/CSS

  [CSS] bug IE ?

 


 Mot :   Pseudo :  
 
Bas de page
Auteur Sujet :

[CSS] bug IE ?

n°1205414
Gravastar
Dude elle est où ma caisse ?
Posté le 22-09-2005 à 18:04:54  profilanswer
 

Bonjour tout le monde,
 
Actuellement en train de faire un site qui s'adapte aux résolutions des visiteurs, j'ai voulu donner quelques effets au fond de la page en intégrant des images aux coins et en bordure (qui lui donnent de l'épaisseur) : http://perso.wanadoo.fr/kaleikonos [...] index.html
 
Mon problème est le suivant : les bords de page s'affichent correctement sous FF, mais n'apparaissent pas sous IE. [:abnocte invictus]
Ma question est donc la suivante (et je pense que ça doit venir de moi, même si je ne vois pas d'où) : est-ce dû à une erreur de ma part (et laquelle) ou à un bug d'IE (et dans ce cas, comment le contourner) ?
 
merci d'avance :)

mood
Publicité
Posté le 22-09-2005 à 18:04:54  profilanswer
 

n°1205422
kalex
Posté le 22-09-2005 à 18:12:56  profilanswer
 

Je viens de jeter un coup d'oeil, pour le comportement d'IE proprement dit, je connais pas la réponse (IE est vieux de 5 ans, c'est peut être ça la réponse :o). Mais ta manière de faire n'est pas la bonne, certes tu utilise XHTML et CSS, mais tu codes comme en HTML. C à-d en créant des éléments dans le code XHTML ne servant qu'a la décoration. En plus, tu les appelles .left ou .right, ce genre de près positionnement ne doit pas apparaître dans du code XHTML.

n°1205436
Gravastar
Dude elle est où ma caisse ?
Posté le 22-09-2005 à 18:19:40  profilanswer
 

kalex a écrit :

Je viens de jeter un coup d'oeil, pour le comportement d'IE proprement dit, je connais pas la réponse (IE est vieux de 5 ans, c'est peut être ça la réponse :o). Mais ta manière de faire n'est pas la bonne, certes tu utilise XHTML et CSS, mais tu codes comme en HTML. C à-d en créant des éléments dans le code XHTML ne servant qu'a la décoration. En plus, tu les appelles .left ou .right, ce genre de près positionnement ne doit pas apparaître dans du code XHTML.


 
Je m'en etais un peu rendu compte en fait, mais je n'ai pas trouve d'alternative.. :/

n°1205445
omega2
Posté le 22-09-2005 à 18:26:20  profilanswer
 

Avec les CSS3, tu poura définir toutes les images de bordure directement dans le css sans bidouille ... vivement css3. ;) Mais c'est vrai qu'en css1 et 2 on peut jsute définir l'image de fond.

n°1205448
Gravastar
Dude elle est où ma caisse ?
Posté le 22-09-2005 à 18:29:48  profilanswer
 

omega2 a écrit :

Avec les CSS3, tu poura définir toutes les images de bordure directement dans le css sans bidouille ... vivement css3. ;) Mais c'est vrai qu'en css1 et 2 on peut jsute définir l'image de fond.


 
Si je me mets a genou et que je prie tres fort il va venir plus vite le CSS3 ?  :D  
 
...sinon pas de solution a mon problème ?  :(

n°1205453
omega2
Posté le 22-09-2005 à 18:32:49  profilanswer
 

Je vérais bien un bug d'IE empéchant le chevochement d'images de fond avec des div imbriqué. (vivement IE7 qu'est sencé corriger tous les bugs de css) Donc a tester : le comportement d'IE en enlevant l'image de fond du div intérieur.
 
Personellement, ce probléme me dépasse mais je suis pas encore un pro du css.

n°1205454
kalex
Posté le 22-09-2005 à 18:33:39  profilanswer
 

Mais plutôt que de faire quelque chose dans ce genre :
XHTML :

<div id="page">
<div class="left"></div>
<div class="right"></div>
</div>


CSS :

#page{...}
#page .left{...}
#page .right{...}


 
Tu peux faire :
 

<div id="page">
<div>
<div>
</div>
</div>
</div>


CSS :

#page div{/*code pour left*/}
#page div div{/*code pour right*/}


 
IE supporte et tu ne salis pas ton code XHTML avec du .left ou du .right.
 
Mais ça ne résout tjs pas ton problème... :o

n°1205457
kalex
Posté le 22-09-2005 à 18:35:55  profilanswer
 

omega2 a écrit :

Je vérais bien un bug d'IE empéchant le chevochement d'images de fond avec des div imbriqué. (vivement IE7 qu'est sencé corriger tous les bugs de css) Donc a tester : le comportement d'IE en enlevant l'image de fond du div intérieur.
 
Personellement, ce probléme me dépasse mais je suis pas encore un pro du css.

Pour repérer le positionnement hasardeux sous IE, j'ajoute souvent une bordure au sélecteur CSS intéressé :
border: 1px solid red
Souvent on voit au moins d'où vient le problème.

n°1205462
omega2
Posté le 22-09-2005 à 18:40:17  profilanswer
 

J'aurais bien dit "drapal" mais là, c'est plustôt "étoil". :D
Bonne idée le coup du border en cas de blem.

n°1205466
Gravastar
Dude elle est où ma caisse ?
Posté le 22-09-2005 à 18:42:40  profilanswer
 

kalex a écrit :

Tu peux faire :
 

<div id="page">
<div>
<div>
</div>
</div>
</div>


CSS :

#page div{/*code pour left*/}
#page div div{/*code pour right*/}


 
IE supporte et tu ne salis pas ton code XHTML avec du .left ou du .right.
 
Mais ça ne résout tjs pas ton problème... :o


 
Je pourrais faire quelque chose dans ce goût effectivement, sauf que dans la page y'a un div pour le menu. Enfin bon, je tiens compte de ta suggestion pour la propreté de mon code et pour prendre de bonnes habitudes, même si dans ce cas particulier, je ne vais pas y gagner grand chose :/
 
Pour ce qui est des bordures, je vais faire ça de suite, pour me donner une petite idée. Idem pour le fond du div omega2.
Merci pour vos suggestions :)

mood
Publicité
Posté le 22-09-2005 à 18:42:40  profilanswer
 

n°1205482
Gravastar
Dude elle est où ma caisse ?
Posté le 22-09-2005 à 19:07:16  profilanswer
 

Euh, j'ai essayé le coup des bordures à gauche... et je dois dire que je ne comprends pas bien le résultat : on dirait que le div contenant l'image de fond de la bordure gauche est... réduit, en quelque sorte :/
 
Je suppose que ça vient du fait que les div dédiés aux bordures ne contiennent rien (comme tu l'avais fait remarqué kalex), et que donc 100% de rien, ça ne donne pas grand chose... mais pour faire comme tu as dit afin d'utiliser ces div en tant que conteneur et non plus comme éléments de mise en page, je dois avouer que je me trouve face à un petit problème :
 
la largeur de mon site fait 85% de la page,
les images des bordures font 19px,
-> comment déclarer la largeur du div de la bordure gauche afin qu'il puisse contenir les 85% du site + les 2x19px des bordures ? :/
(puisqu'il doit devenir un conteneur et plus seulement une décoration)
 
La solution serait peut etre de remplacer les div des bordures par des images, mais je ne souhaitais pas mettre autre chose que des images de fond :(
 
Je ne sais pas si j'ai été très clair, mais je n'arrive pas à l'être plus pour le moment.

n°1205489
kalex
Posté le 22-09-2005 à 19:19:02  profilanswer
 

En reprenant mon exemple, tu donnes 85% de largeur à #page, pour les div à l'intérieur tu ne te préoccupes pas de leurs largeurs, car elle sera par défaut égal à 100% de #page. Pour les bordures tu peux faire quelque chose comme ça :

#page div{
 background-image: url("bordure-right.png" );
 background-position: right;
 background-repeat: repeat-y;
 padding-right: 19px;
}
#page div div{...}

n°1205501
Gravastar
Dude elle est où ma caisse ?
Posté le 22-09-2005 à 19:40:09  profilanswer
 

kalex a écrit :

En reprenant mon exemple, tu donnes 85% de largeur à #page, pour les div à l'intérieur tu ne te préoccupes pas de leurs largeurs, car elle sera par défaut égal à 100% de #page. Pour les bordures tu peux faire quelque chose comme ça :

#page div{
 background-image: url("bordure-right.png" );
 background-position: right;
 background-repeat: repeat-y;
 padding-right: 19px;
}
#page div div{...}



 
Bon, j'ai plus ou moins fait ce que tu disais . C'est encore un peu cochon, mais ca va devenir plus propre des que je saurais comment contourner le petit problème qui est survenu : les images des bordures s'arrete avant la div de liens appartenant au footer mais apparaissant juste au-dessus de lui (sur le contenu de la page, en bas de page) sous FF, et ils s'arretent à la dernière ligne de texte sous IE (alors que la div contenant les images des bordures possède le même min-height que la div de page).
 
Anyway, merci pour vos suggestions, je vais prendre une pause et tenter d'y voir lus clair par moi-même. Sinon je ferai un petit up en espérant de pas embetter trop de monde.


Aller à :
Ajouter une réponse
  FORUM HardWare.fr
  Programmation
  HTML/CSS

  [CSS] bug IE ?

 

Sujets relatifs
Héritage de taille em (CSS).CSS : problème de border
Pas vraiment HTML/CSS/Javascript mais...[CSS] validité w3c
[CSS] Adieu tableau, à moi la puissance du css [MAJ]Decalage classique en CSS
Menu (CSS + php/javascript)Je veux apprendre l'HTLM, je me mets direct au CSS ?
pb mise en page CSS[CSS] pour un gros nul qui débute
Plus de sujets relatifs à : [CSS] bug IE ?


Copyright © 1997-2022 Hardware.fr SARL (Signaler un contenu illicite / Données personnelles) / Groupe LDLC / Shop HFR