[Résolu] Effet d'ombre sur une mise en page

Bonjour à tous,

Je sollicite votre aide pour savoir comment faire un effet d'ombre sur une mise en page fluide.

En fait, je n'ai pas encore produit de code (c'est pour ça que je n'en poste pas) mais j'ai une petite idée de ce que je veux obtenir.
Je voudrai faire une mise en page fluide à 80% de la largeur de l'écran et de chaque côté de la div du conteneur globale (qui contient toutes les divs, un peu comme dans les tutos d'alsa) je voudrai faire un effet d'ombre.

Que me conseillez vous ? et où puis-je trouver de la documentation ?

Merci d'avance
Modifié par TylerD (20 Apr 2006 - 01:39)

le moyen le plus simple c'est demettre une image qui se repete sur la hauteur en bordure du conteneur principal.
apres tu as la solution de mettre un div en position:relative avec un arriere plan de couleur +sombre et decalé de qq px mais bon mettre un cadre supplementaire alors qu'avec une imge de 2px tu arrives au meme resultat

Merci de ta réponse, mais si je met une image qui se répéte en hauteur, il faut que je connaisse la largeur de mon contenant... ici je voudrai le faire en pourcentage...

Est ce qu'on peut mettre une image en bordure d'un élément ? car si oui je ne connais pas !

Ben oui on peut :

voilà un petit essai

Par contre il faut toujours penser que ce genre de chose s'élabore à partir d'un code html "concret".
Modifié par clb56 (19 Apr 2006 - 17:56)

clb56 a écrit :
Ben oui on peut :
voilà un petit essai

Tiens, ça me rappelle celui-ci
Tu as retravaillé à partir de ma page, ou bien tu as refondu la première page de test que tu avais faite ?

Merci pour vos réponses, les exemples sont très évocateurs.

En fait, les bordures sont des fonds et on ne peut définir qu'un seul fond par éléments ?
Dans le cas de l'exemple de mpop chaque élément permet de construire le contour avec une image de fond en dégradé alors que l'exemple de clb56 construit le contour à partir de 2 div de base (conteneur et sub_conteneur) pour les bordure de droites et de gauche.

Quelle est la meilleure méthode ?

@+

Tiens tant qu'on y'est, voici une solution maison : http://www.alsacreations.com/articles/cadre/#deux

(qu'on retrouve d'ailleurs dans un bon livre CSS que je connais )

TylerD a écrit :
En fait, les bordures sont des fonds et on ne peut définir qu'un seul fond par éléments ?

C'est ça. Comme on ne peut pas avoir plusieurs images de fond pour un seul élément (ce qui est regrettable), on doit alourdir le code. Donc on essaie au maximum d'utiliser les éléments déjà présents dans le code (un titre, un paragraphe, etc.).

TylerD a écrit :
Quelle est la meilleure méthode ?

Pas sûr que l'une soit meilleure que l'autre...

Merci beaucoup je vais bosser là dessus...
Dites donc Raphael tu ferai pas un peu de pub !! je vais appeler un modérateur

D'autant plus que dans l'exemple les bordures ombragées sont oubliées

mpop a écrit :

Tiens, ça me rappelle celui-ci
Tu as retravaillé à partir de ma page, ou bien tu as refondu la première page de test que tu avais faite ?

Attention mpop !

Le départ de tout ceci est un post de ce forum où je répondais à une question de ta part. Que cela t'ais permis ensuite d'avancer sur fond (relatif soit) de méfiance envers celui qui t'avais aidé est une chose (déjà à l'époque tu émettais l'idée que les démonstration que j'avançais pouvaient ne pas être de moi mais du repiquage à droite à gauche). Que maintenant tu viennes te présenter comme référence sur ce sujet et bien sache que pour moi ce n'est vraiment pas le cas. Sur ce point mes tests et réflexions sont les seules références.

Que je n'ai aucune envie de jouer au manitou est une chose (au demeurant assez lucide)

Que je laisse d'autre s'approprier les quelques éléments que je donne ici ou là est une faiblesse que je me pardonne peut être à tort.

Que je me prenne en boomerang le résultat de tout ceci en étant soupçonnable du plagiat de ceux que j'ai initialement aidés je trouve ça insultant et carrément écoeurant.

Sur ce coup là je suis vraiment très en colère !!!


à TylerD

Il ne s'agit pas de méthode a priori mais de travail sur un code html pré existant. Tant que ce code, c'est à dire le document html lui même, n'existe pas avec sa consistance (c'est à dire un vrai balisage qui le structure) alors on ne sait même pas quelle piste doit être explorée.
Modifié par clb56 (20 Apr 2006 - 23:51)

a écrit :
Merci à tous pour les réponses qui ont été apportées, le sujet est-il résolu ?

J'ai déjà changé le titre du sujet dès que j'ai eu les réponses que je voulais