Obtenir cet effet de conteneur

Saut!

Je voulais savoir comment implémenter le code css de ce conteneur fait à l'aide de photoshop.



Ce que j'ai essayé de faire c'est:

.container-bg{
/* gradient background */
background: #f2f2f2; /* Old browsers */
background: -moz-linear-gradient(top,  #f2f2f2 0%, #f1f1f1 52%, #f2f2f2 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f2f2f2), color-stop(52%,#f1f1f1), color-stop(100%,#f2f2f2)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  #f2f2f2 0%,#f1f1f1 52%,#f2f2f2 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  #f2f2f2 0%,#f1f1f1 52%,#f2f2f2 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  #f2f2f2 0%,#f1f1f1 52%,#f2f2f2 100%); /* IE10+ */
background: linear-gradient(to bottom,  #f2f2f2 0%,#f1f1f1 52%,#f2f2f2 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f2f2f2', endColorstr='#f2f2f2',GradientType=0 ); /* IE6-9 */

/* border radius */
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
}

Mais le resultat est trop loin de mes attentes

Je vous remercie
Modifié par Keyser_Soze (26 Apr 2013 - 22:53)

Salut,

l'autre jour j'ai trouvé ça, ça peut sûrement t'aider !

Johan

Johan_Clbrt a écrit :
Salut,

l'autre jour j'ai trouvé ça, ça peut sûrement t'aider !

Johan

Merci bien Johan
J’espère que ça va donner l'effet recherché

J'arrive pas à le faire

Johan_Clbrt a écrit :
l'autre jour j'ai trouvé ça, ça peut sûrement t'aider !

Avec un tuto de ce genre j'étais arrivé à faire des effets d'ombres convexes sous mes div (mais j'avais dû adapter le code afin de correspondre à toutes les tailles de div possible). J'ai aussi mis un effet gradient dans les div... en laissant de côté IE8.

Voir par exemple ici : effet gradient.