Image de fond arrondie suivant les changements de taille de la fenêtre
Dans la page d'exemple se trouve un texte sur une image qui suit le texte même si on agrandit ou
raccourcit la fenêtre du navigateur, ou que l'on agrandit/rétrécit la fonte.
C'est ok pour Firefox 2, IE6/IE7, Konqueror, et donc peut-être aussi pour Safari.
Je suis intéressée à savoir comment c'est sur
d'autres navigateurs. Après l'exemple avec la première image se trouve une capture d'écran de comment ce
devrait être. Si vous voyez des différences, je suis intéressée par la capture de ce que vous voyez avec des informations sur le navigateur: nom, version, type (graphique/texte), système d'exploitation ...
Les exemples sont réalisés avec des styles et des divs. Les images sont découpées en 9: 4
coins, 4 bords + le milieu.
Je n'ai pas utilisé l'attribut float, trop imprévisible pour IE, mais des
emboitements de div: "div haut" contient "div coin gauche de largeur 100% avec un
padding-gauche de largeur l'image du coin" contient "div coin droit de largeur 100% avec un
padding-droit de largeur l'image du coin" contient "div bord haut de
largeur 100%".
Le texte utilisé sur les images est du "faux texte", www.lorem-ipsum.info
donne son historique.
J'ai essayé avec 2 images très différentes.
Voici un paquet compressé contenant tout: fichier html de base avec le texte et
les styles plus toutes les images.
J'ai sorti l'exemple de cette page car il y avait un conflit de style avec le générateur automatique de page.