Probleme d'ombre en CSS (firefox et konqueror)

jeanpba · Message par **jeanpba** » 25 févr. 2005, 23:15

Bonjour

je veux faire deux boites avec un effet d'ombre. La premiere est noire et par dessus en
relatif, je viens deposer une seconde boite blanche un peu decalée. Cela marche bien
sur Firefox et Konqueror quand j'indique des PIXEL (px) , mais quand j'indique une position
en pourcentage, Konqueror ne marche plus. Pourriez vous me dire pourquoi ?

voici le script en pixel qui marche sur firefox et konqueror :

<html>
<head>
<meta http-equiv=Content-Type content="text/html; charset=iso-8859-1">
<style type="text/css">
.shadow {
width:200px ;
height:200px ;
background-color:black }
.boite {
width:200px ;
height:200px ;
background-color:white ;
border: solid 2px black ;
position:relative ;
top:-7px ;
left:-7px}
</style>
</head>
<body>
<div class="shadow">
<div class="boite">I am a white box</div>
</div>
</body>
</html>

et le script en % qui ne marche que sur firefox, konqueror n'affiche que la partie
de la fenetre blanche où j'écris qquelquechose:!

<html>
<head>
<meta http-equiv=Content-Type content="text/html; charset=iso-8859-1">
<style type="text/css">
.shadow {
width:40% ;
height:40% ;
position:absolute;
background-color:black }
.boite {
width:100% ;
height:100% ;
background-color:white ;
border: solid 2px black ;
position:relative ;
top:-7px ;
left:-7px}
</style>
</head>
<body>
<div class="shadow">
<div class="boite">I am a white box</div>
</div>
</body>
</html>

Merci de votre aide !!!

Jean-Philippe

calimo · Message par **calimo** » 26 févr. 2005, 11:50

Ton code n'a pas de doctype. Cela suffit à faire basculer les navigateurs en mode "quirk" dans lesquels ils ont des comportements étranges visant à la compatibilité. Leurs réactions sont donc totalement imprévisibles, surtout en matière de CSS où il est extrêmement important de s'assurer que tous les navigateurs sont bien en mode de respect des standards

Un peu de lecture : http://pompage.net/pompe/declarations/

jeanpba · Message par **jeanpba** » 26 févr. 2005, 17:24

Salut Calimo

Merci et désolé de ne pas avoir indiqué mes DTD mais c'est pareil pour les trois.
j'ai remis ca au propre sur mon site :

Donc quand j'indique une grandeur en px , avec n'importe quelle DTD car marche
sur firefox et konqueror:
http://jeanpba.homeip.net/Divers/ombre_ ... trict.html
http://jeanpba.homeip.net/Divers/ombre_ ... ional.html
http://jeanpba.homeip.net/Divers/ombre_ ... tml11.html

Mais quand je met une grandeur en pourcentage (ce que je voudrais faire pour
m'adapter aux ecrans, ca marche sur firefox mais konqueror n'affiche que si je
met du texte ligne apres ligne:
http://jeanpba.homeip.net/Divers/ombre_ ... trict.html
http://jeanpba.homeip.net/Divers/ombre_ ... ional.html
http://jeanpba.homeip.net/Divers/ombre_ ... tml11.html

Explications: je cree une premiere boite en absolute, defini en % : OK
ensuite, heritée de cette div, une seconde boite decalée et relative dans laquelle j'écris
et je referme les deux div

j'ai essayé avec konqueror 3-1-12 et 3-3-08 et c'est pareil !
par contre ca marche avec firefox, mozilla, netscape 7 , opera ... et meme ... IE 5
et IE 6 !!!!

je ne comprends pas
merci de votre aide si vous avez 5 secondes !

jean-philippe

calimo · Message par **calimo** » 26 févr. 2005, 18:28

5 secondes j'ai mais malheureusement je suis sous Windows

Si je regarde sur la page du CSS support in KHTML, il semblerait que ces propriétés devraient être supportées (au passage je constate que le moteur a fait de sacré progrès depuis quelques mois... ou alors ils ont pensé à mettre la page à jour ?)

Je ne sais pas exactement quel est le symptôme, mais se pourrait-il que ce soit les décalages (top, left) qui ne sont pas supportés sur une boite en position relative ?

Je crois qu'il faudrait poser cette question sur un forum dédié à Konqueror plutôt...

Geckozone

Probleme d'ombre en CSS (firefox et konqueror)

Probleme d'ombre en CSS (firefox et konqueror)

Qui est en ligne ?