28172 sujets

CSS et mise en forme, CSS3

Background-image-width ? ça n'existe pas et c'est bien dommage :/

Bonjour,

Lisant les tutorials depuis un bon bout de temps sur votre site, j'ai décidé de sauter le pas et de m'inscrire sur le forum pour y participer.

Je vous présente un problème que j'ai actuellement.
Je fais un site avec des width en %.
J'ai donc fait plusieurs blocs : un volet gauche une partie centrale et un volet droit.


#volet_gauche
{
	float: left;
	width: 18%;
	text-align: center;
}

#center
{
	float: left;
	width: 60%;
	margin: 0% 2%;
}

#volet_droit
{
	float: right;
	width: 18%;
	text-align: center;
}


J'aurai aimé appliqué la même image de fond à ces trois blocs ; l'image de fond se redimensionnant à la taille du bloc automatiquement (si l'image est déformée, ce n'est pas grave)

J'espère que vous comprendrez mon problème Smiley ravi
Merci d'avance Smiley cligne
Modifié par Librius (19 Jun 2009 - 14:00)
Hello,

C'eût été plus "facilitant" de pouvoir avoir accès à cette image de fond, ou au résultat escompté (une page en ligne dans l'idéal) pour pouvoir t'apporter une éventuelle solution (?)
Tu peux parfaitement utiliser la même image de fond pour différents conteneurs :

#volet_gauche,#center,#volet_droit {
background: couleur de fond url(ton image) repeat-x ou y (ou non) positionnement;
}

Plus d'informations sur le site de Pompage (par exemple) Smiley cligne

A te lire,
Cdt,
Sylvain
Bonjour,

Ci-joint l'image que j'aimerais afficher (image de test encore)
upload/22362-File0001.png
(L'aperçu aparaît comme un bloc rouge mais ce n'est pas ce n'est pas un bloc)

Mon problème n'est pas d'utiliser la même image de fond pour les différents conteneurs mais que l'image s'adapte à la taille du conteneur.

PS : j'avais déjà jeté sur le site que tu me proposes Smiley biggrin
Modifié par Librius (19 Jun 2009 - 13:59)
Re,

AMHA tu ne trouveras pas de solution via css, peut-être orienter tes recherches du côté des langages dynamiques (javascript,PHP, etc...), notamment à cause de cet effet recherché (redimentionnement automatique en fonction du conteneur) mais je peux me tromper...auquel cas j'apprendrais quelque chose aujourd'hui et ce ne sera déjà pas si mal Smiley cligne

En attendant des réponses plus éclairées, je te souhaite une bonne journée Smiley smile

Cdt,
Sylvain
Bonjour,

Merci à tous pour vos réponses.
Pour ce qui concerne l'astuce de Raphaël, je l'avais lu auparavant, cependant je mets mes blocs en flottant. Ceci est-il toujours possible en positionnant en relatif ou absolu ?

background-size aurait été bien utile si elle était supportée par mozilla et IE Smiley bawling
Sinon oui je vais surement m'orienter vers du js.
Il est vrai que cette propriété CSS aurait été sympa si elle était supporté par la majorité des navigateurs utilisés Smiley decu
Enfin, j'avais ensuite pensé à faire deux blocs strictement identiques puis de les superposer via un z-index. Je suis retombé sur un échec Smiley ohwell .
Je vais passer à autre chose en attendant.

Merci beaucoup à tout ceux qui m'ont répondu et je vous tiens au courant quand je me remets sur ce problème Smiley cligne
Sujet clos
Aller à