28173 sujets

CSS et mise en forme, CSS3

Bonjour à tous,

Je suis en train de faire un site contenant un cadre de 760 pixels de largeur avec une ombre extérieur. Pour ma mise en page j'ai donc du créé plusieurs divs contenant chacun les ombres sur les cotés. Un div contenant le bandeau, un autre pour le logo, un autre pour le texte qui sera extensible suivant le flux de texte ajouté et enfin un dernier pour l'ombre du bas qui lui sera fixe. Justement en ce qui concerne le div du bas, j'ai du créer une tranche spéciale dans image ready contenant l'image du bas de mon cadre avec son ombre et les coins. Je me demandais donc si il y avait pas moyen de mettre mon image complète dans un seul div contenant le fond texte et bas ? parce que je si met tout cela en une seule partie, l'ombre du bas va se répéter sans cesse si je rajoute du texte dans le div texte.

Merci par avance de vos réponses
Bonjour,

On peut avoir un aperçu de ce que tu as fait (page en ligne de préférence) ?

Mais à priori il te suffit d'avoir un conteneur global de 760px de large qui aura l'image répétée en hauteur pour dessiner les bordures des côtés, et dans ce conteneur global :
- un en-tête avec la bordure du haut ;
- un pied de page avec la bordure du bas.

Ça ne devrait pas être bien compliqué.

Autre petite chose qui pourrait être utile : nous montrer une image de ce que tu veux réaliser, afin qu'on te conseille un moyen correct d'y parvenir.
Modifié par Florent V. (24 Apr 2007 - 15:56)
Salut,

Je te remercie de cette réponse si rapide, en faite je travaille en locale en ce moment je n'ai pas encore les passes et login du site. J'ai fais exactement de la manière que tu décris, enfin pas pour la partie du haut puisque les marges sont à zéro, j'ai donc seulement mis les arrondis en bas. Donc pour ce div bas, j'ai mis en background non répété, une image de 20 pixels de hauteur dont 10 pixels pour l'ombre et 10 pixels pour avoir les arrondis. Le rendu semble impéccable, donc si je comprend bien c'est la seule technique ?
Mika13 a écrit :
donc si je comprend bien c'est la seule technique ?

Vu que je ne sais pas exactement ce que tu as réalisé et que je ne sais que vaguement quel était le résultat souhaité... je n'en ai pas la moindre idée.

À priori il y a plusieurs manières de faire ce que tu souhaites. Mais sans en savoir plus, impossible de détailler.
Comme tu le dis, si tu répete l'image contenant les bordures latérales + la bordure du bas, ta bordure inférieure sera répétée tout du long.

Ta technique est donc a priori la bonne, maintenant c'est vrai qu'une capture écran pourrait nous donner des idées Smiley cligne
Ok les gars, merci de vos réponses, je vais voir si j'ai pas un pote qui à un compte free sous la main. Comme ça, je pourrai en même temps tester sous plusieurs navigateurs pour apprécier le rendu.
Modifié par Mika13 (24 Apr 2007 - 18:00)