28221 sujets

CSS et mise en forme, CSS3

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 en
ne prenant plus en compte la taille totale de la fenetre relative
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">
div.shadow {
width:200px ;
height:200px ;
background-color:black }
div.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">
div.shadow {
width:40% ;
height:40% ;
position:absolute;
background-color:black }
div.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
Rebonjour PoPHP

et désolé pour le manquement à la regle, j'ai revu ca en mettant de bonnes DTD
et en mettant ca directement 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_px_dtd_xhtml10strict.html
http://jeanpba.homeip.net/Divers/ombre_px_dtd_xhtml10transitional.html
http://jeanpba.homeip.net/Divers/ombre_px_dtd_xhtml11.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_pc_dtd_xhtml10strict.html
http://jeanpba.homeip.net/Divers/ombre_pc_dtd_xhtml10transitional.html
http://jeanpba.homeip.net/Divers/ombre_pc_dtd_xhtml11.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