Bonjour,
J'ai un souci que je pense classique. Le but est de placer une fine zone à coins supérieurs arrondis (ou coupés, peu importe) en utilisant la transparence gif. La largeur de la page doit pouvoir être variable.
Je teste avec IE6, Firefox 1.0.6 et Opera 8.
J'ai fait de nombreux essais, voici une solution parmi les plus simples:
le CSS:
Le HTML correspondant:
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19 #reglette { margin:0px 17px 0px 17px; height:10px; background:url("images/reglettefond10.gif") repeat-x bottom; } #reglette #imggauche { float:left; margin-left:-17px; width:17px; height:10px; background:url("images/reglettegauche10.gif") no-repeat bottom; } #reglette #imgdroite { float:right; margin-right:-17px; width:17px; height:10px; background:url("images/reglettedroite10.gif") no-repeat bottom; }
C'est impeccable sous FF et Opera, le problème c'est IE6 qui ignore les images de coin, à cause du margin négatif.
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4 <div id="reglette"> <span id="imggauche"></span> <span id="imgdroite"></span> </div>
J'ai essayé d'ajouter une zone centrale pour ne plus avoir de marges négatives, mais ou c'est impossible, ou je ne suis pas assez calé en float (ce qui est le cas).
Des solutions au problème, j'en aurais certainement, d'autant que je génère en PHP et que je peux détecter IE6. Mais j'ai évité ça jusqu'ici. Il y a même encore plus simple, puisque je suis pour l'instant sur fond uni et que j'y resterai sans doute.
Voilà, j'aimerais bien régler le problème tel qu'il est, sans trop "négocier".
Merci d'avance pour toute suggestion
Pierre
Partager