28220 sujets

CSS et mise en forme, CSS3

Bonjour tt le monde !

Voilà, j'ai fais une version vite faite de mon site (www.ibsciss.com) et je suis en train d'en refaire une plus compatible et respectueuse des standards Smiley smile

Seulement, j'ai un problème avec l'image de fond. C'est une image de 100x250px qui s'agrandis selon la taille du corps du site, tout simplment via
<img src="..." alt="" class="class" />

.class {width: 100%;
	   height: 100%;
           position: absolute;
	   border: 0px;
	   z-index: 0;
}

mais cette solution ne marche pas avec IE et Opera, et je la trouve assez gênante...

Alors voilà, je voudrais savoir s'il est possible de mettre cette image en fond et d'étendre sa hauteur à 100% ? Un truc du genre

#Corps {background-image: url('...');
           background-repeat: repeat-x;
           background-heigth: 100%
}


Haaa, si background-height existait Smiley ravi


Merci de votre aide Smiley smile
Modifié par krisdevill (31 Mar 2005 - 19:08)
Le problème, dans cette solution, c'est que le background se répète en longueur, donc le dégradé se multiplie, et c'est pas très beau Smiley decu

Un heigth: 100% permettrait à l'image, et donc au dégradé, de s'étendre sans se répéter, et ça fait (plus) joli Smiley smile ...


Merci pour l'aide Smiley smile
arf, ça ne marche pas non plus, mais on y est presque Smiley cligne

Le problème, c'est que si je mets height: 100% pour le conteneur (Corps), le contenu de ce conteneur sort du conteneur lorsque la taille du contenu dépasse le height : 100% Smiley decu

sinon, ce serait pas possible de faire ça avec un "content:" en CSS ?

merci
Administrateur
krisdevill a écrit :

Le problème, c'est que si je mets height: 100% pour le conteneur (Corps), le contenu de ce conteneur sort du conteneur lorsque la taille du contenu dépasse le height : 100% Smiley decu
Alors il faut utiliser min-height.
hmf, figurez-vous que j'ai trouvé le problème, mais je suis incapable de le résoudre Smiley confus ...

Le problème, c'est que le navigateur veux laisser l'image proportionnelle, du coup, quand je fais width: 100%, il faut que le height équivale, donc il me mets un height plus ou moins long, dependant de la taille de la fenêtre (le width fait 80% de la page)...

Est-ce qu'il est possible de "déproportionnaliser" une image ?


merci Smiley smile


ps: min-height ça fais comme si il n'y avez pas de height...
moi aussi ca minteresse!!!
j'aimerais que mon fond soit toujorus a 100% .... car quand la reso de l'ecran change c'est toujours moche..... Smiley decu
oui c'est la soluce pour mon problème!
mais mon problème c'est ke je comprend pas comment faire pour que l'image que tu inseres comme ca :
<img id="arriere" alt="" src="araignees.jpg" />


soit prise en compte comme arriere plan et non comme une image normale!!
parce que la mon image fait bien la taille de mon ecran mais le texte est apres l'image........au lieu d'etre dessus?!!

[edit : Désolé pour le code et la syntaxe! Smiley cligne ]
Modifié par Boulou (06 Apr 2005 - 11:18)
Boulou a écrit :
oui c la soluce pour mon pb!
ms mon pb c ke je pige pas comment faire pour ke limage ke tinsere comme ca : <img id="arriere" alt="" src="araignees.jpg" />

soit prise en compte comme arriere plan et non comme une image normale!!
parce ke la mon image fai bien la taille de mon ecran ms le texte est apres limage........au lieu d'etre dessus?!!

Bonjour Boulou,
Merci de prendre le temps de lire Aides/Règle du forum, pour bien présenter du code dans tes posts, et merci de ne pas utiliser de langage sms et autres abréviations. Tout est dans les règles Smiley cligne
Administrateur
Boulou a écrit :

soit prise en compte comme arriere plan et non comme une image normale!!
parce que la mon image fait bien la taille de mon ecran mais le texte est apres l'image........au lieu d'etre dessus?!!

C'est expliqué dans le billet : pour que les éléments se superposent, il faut utiliser les propriétés de positionnement CSS (absolute, relative, fixed) couplées à la propriété de profondeur "z-index".
ok donc je peux pas utiliser cette solution..... car j'utilise un CMS et pour comprendre et rajouter des Div... c'est pas la peine....
dommage... je remettrais un fond uni!
merci quand même! Smiley cligne
Administrateur
La mise en page (CSS) n'a rien à voir avec le fonctionnement d'un CMS : il rajoute de la structure (div) sans interférer dans la feuille CSS et donc dans le positionnement.

Dans un CMS, comme n'importe quel site, tu as une structure (HTML) et un habillage (CSS). Le CMS fait que modifier la structure à partir de templates et rajouter du contenu.
non en fait mon problème c'est que je peux pas me permettre de rajouter un div par ci par la dans le code HTML...
Ca ferai trop de bidouillage à mon goût pour un résultat qui pourrait vite être moche aussi selon le redimensionnement et les proportions de l'image ..