28172 sujets

CSS et mise en forme, CSS3

Bonjour à tous Smiley cligne

J'ai découvert le tutoriel de Raphael traitant des ombrages en CSS3, je l'ai donc utilisé dans mon site internet que voici : http://www.orangedrink.ch/index.html

Cela créé un halo dégradé à gauche et à droite de mon div conteneur, donc toute la partie visible du site.

Néanmoins j'ai remarqué que la largeur du site est plus grande qu'avant mais uniquement sous une résolution de 1024 x 768.

Sur cette résolution, j'ai une marge à droite du site, donc un scroll horizonzal, le site ne se centre donc pas.

Il ne me semble pas avoir remarqué la même chose sur une plus grande résolution, le site semble centré au milieu de la page.

Par contre, sur mon téléphone portable Samsung, je retrouve ce décalage...

Si je supprime les propriétés box-shadow que voici

-moz-box-shadow: 0px 0px 70px #555; 
-webkit-box-shadow: 1px 1px 12px #555; 
box-shadow: 1px 1px 12px #555; 


Je retrouve un conteneur centré sans marge à droite.

Pourtant Raphael dit la chose suivante

a écrit :
L'ombrage n'affecte pas la taille de la boîte de l'élément


L'ombrage ne devrait donc pas agrandir la largeur du bloc conteneur...

Qu'en pensez-vous ?

Merci beaucoup d'avance et bonne journée Smiley lol

PS : J'utilise Firefox 3.6.13
Modifié par marc.suisse (04 Feb 2011 - 15:11)
Exact,
D'ailleurs petite remarque en passant j'ai eu le même souci hier sur la hauteur de mon wrapper. J'avais un décalage de quelques pixels en bas du fond de mon conteneur principal pourtant bien en height 100% (positionné, avec html et body en height 100% et tout comme il faut)...
Eh bien c'était à cause de son ombre portée GRR !!!!

Maudit FF, j'ai cherché pendant des heures avant de me rappeler ce fichu défaut.