28172 sujets

CSS et mise en forme, CSS3

Bonjour à tous,

tout d'abord un lien pour illustrer mon problème:
http://arnault1891.olympe-network.com/espace.jpg

La "boite" sur l'image est de largeur fixe mais de hauteur modifiable, pour le moment elle comporte:
- une image fixe chapeau,
- une image fixe en largeur couplé à un repeat-y pour le fond de la boite,
- une image fixe pour le socle.
(Toutes ces images sont en background dans le css)

Vous pouvez discerner sur l'image l'espace entre le texte(DERNIER AJOUTS tout voir) et la continuité de la barre, j'aimerai supprimer cet espace pour que le texte soit pratiquement collé à la barre, le texte changeant selon les pages je ne peux définir une image fixe en largeur.

Pour résumer je souhaiterai que mon texte, selon le cas, pousse ou rallonge la barre située à sa droite sans dépasser du cadre en largeur.

Merci de votre aide et du temps que vous passez à tenter de solutionner mon problème.

Arnault

PS: Sympa le poisson d'avril Smiley cligne
PS2: Si le lien ne fonctionne pas remplacer e s p a d r i l l e par e s p a c e
Modifié par Arnault1891 (03 Apr 2009 - 20:05)
Bonjour,

/me se concentre très fort et essaye de deviner le code

Plus sérieusement, sans code, je ne peux faire que des supposition concernant celui-ci. J'imagine donc que tu place le texte par dessus l'image chapeau avec un fond coloré. Pour que ce fond dépasse, j'imagine que tu as donné une largeur au texte, donc dans ce cas la solution serait de supprimer cette largeur.

Mais je risque fortement de me tromper.
Modifié par Laurie-Anne (02 Apr 2009 - 08:26)
ok, je comprend:
http://arnault1891.olympe-network.com/test/test.htm <le résultat
http://arnault1891.olympe-network.com/test/styles.css <le style
http://arnault1891.olympe-network.com/test/img/ <les images

Mais mon code ne va aider personne malheureusement par rapport à la réponse que j'attends puisque je compte découper 2 angles et 1 pixel de largeur en repeat pour la barre situé à droite (c'est la solution que j'ai supposé mais que je n'arrive pas à appliquer).

Je rappel que je souhaiterai que la barre horizontale situé à droite du
<span>"détails de l'ouvrage"</span>
soit extensible et rétrécissable selon ce qu'il y est écrit à la place de "details de l'ouvrage" par exemple "auteurs", "Alice au pays des merveilles" etc... ainsi il n'y aura pas d'espace entre le span et la barre.

Merci Smiley smile
Voilà la réponse:
http://www.siteduzero.com/forum-83-387760-p1-positionnement-extensible-en-largeur-et-retractable.html

Apparemment la personne qui m'a offert la réponse n'a pas eu besoin d'utiliser son pouvoir
function concentrer()
si fort que ça pour comprendre mes attentes Smiley smile

ps: à prendre au seconde degré évidement Smiley smile j'apprécie l'aide surtout que vous cherchiez surement une solution css propre et que la solution trouvée (qui me convient très bien) est détournée de son usage principal
Modifié par Arnault1891 (03 Apr 2009 - 01:05)
C'est effectivement une solution détournée et pas des plus appropriées.

Alors qu'une solution propre existe.

Le problème vient de l'image : "img/barrett_voir.jpg" dont la largeur de "l'espace" est définie. Il suffit de refaire une image avec une barre continue. Puis dans le code CSS :
.der_ajouts span
	{
	font-size: 17px;
	font-weight: bold;
	margin-left: 16px;
	[b]background:#couleur de fond de la page;[/b]
	}

Modifié par Laurie-Anne (03 Apr 2009 - 09:15)
Ah oui effectivement je devais avoir mal au crâne quand j'ai fais mes tests parce que la solution est on ne peut plus simple ...

Merci beaucoup Smiley smile
Modifié par Arnault1891 (03 Apr 2009 - 19:41)