Combler image en Background

Bonjour,

voivi mon problème :
je dois mettre une image de fond aux bords arrondis dans un div. Ce div est étirable selon la longueur du texte. J'ai donc découpé le fond de l'image (les quelques lignes de pixels qui ont l'arrondi) et l'ai "posé" au fond du div. Le reste de l'image est positionné en haut.

Je voudrais que entre les 2, un couleur vienne se mettre pour combler le vide.

J'ai tenté ça :

Code:

---

background: url(../../images/fond_caddie.gif) repeat-y #6b91a6;

---

mais ça me répète l'image.

Quelqu'un peut m'aider ? :?

Personnellement, j'ai une méthode, certainement mauvaise d'ailleurs...

Tu découpe ton image en 9 (coin haut gauche, haut, coin haut droit, etc...)

Et tu place tous ces éléments correctement ensuite.
les haut et bas on un repeat-x , les élements gauche et droite un repeat-y, le centre se répète dans les deux sens, les coins restent fixes.

Citation:

---

Ce div est étirable selon la longueur du texte.

---

En largeur, en hauteur ?

Si un seul des deux sens s'étire, tu peux simplifier la chose.

Enfin, ca reste une méthode pas terrible je trouve... Si quelqu'un a mieux...

Il s'étire sur la hauteur, vers le bas.

On m'avait indiqué plus simple que découper en 9 mon image.
Merci pour ta réponse en tout cas, peut être y a-t-il plus simple ?

Puisqu'il n'y a qu'une direction tu peux restreindre à 3.

Je vais essayer comme ça. Je reviens pour vous tenir au courant.

Merci

Il n'y a pas encore de moyen propre pour faire des arrondis, ou n'importe quelle autre forme géométrique différente du rectangle.

Le recours aux images est donc la solution la plus simple et efficace.

Je pratique aussi le découpe en 9, ça marche plutôt bien, mais ça peut devenir galère à gérer selon le type de positionnement que tu emploies dans le cas où tu n'utilises pas de table.

En fait, j'ai trouvé. J'étais pas très loin avec ma première solution.
Vu que je veux faire un étirement vertical, je découpe mon image en 2. (j'ai oublié de précisé que mon image est dégradée, mais ça n'a pas trop d'importance).

Alors je la découpe de la manière dont j'ai dit : le fond, quelques lignes de pixel, juste de quoi prendre les arrondis en compte, et le reste. Je cale ça dans des div. Pour l'image de haut je fais comme ça :

Code:

---

background: url(../../images/fond_caddie.gif) no-repeat #6b91a6;

---

#6b91a6 étant le couleur de mon dégradé au niveau de la découpe.

Du coup, ça me comble le blanc lorsque l'image s'étire par cette couleur.

----

Mais je ne connaissais pas cette méthode de découper en 9. Par moment j'ai l'impression de bidouiller pour le css me je me rends compte que c'est répandu.
Merci de m'avoir répondu en tout cas. Je pense que vos solutions pourront me servir dans un autre cas.