Bonjour à tous chez ami collègue !
J'ai essayé cette petite technique qui sur le coup m'a parru tres ingénieuse ! malheureusement apres réflexion, j'ai observé une incompatibilité avec notre cher IE...
Vous allez me dire : "normal est toujours là pour nous faire chier !"
Que ferait on sans IE !
Enfin bref :
Mon CSS : h1 { margin: 4px 0 0 10px; color: #7d7d7d; font-size: 0.9em; } a img { border: none; } img.center { display: block; margin-left: auto; margin-right: auto } #gauche { float: left; width: 197px; } .g_titre { position: absolute; float: left; width: 197px; height: 22px; background-image: url("images/g_titre.png"); background-repeat: no-repeat; } #g_menu { list-style-image: url("images/fleche.gif"); margin: 0; padding: 0; } #g_menu ul { margin-top: 5px; } #g_menu li { margin-bottom: 10px; margin-left: 28px; line-height: 5px; } #g_menu a { margin: 0 2px; color: #282828; font-size: 0.8em; text-decoration: none; } #g_menu a:hover { text-decoration: none; color: #4472b2; font-size: 0.9em; }
Mon HTML : <ul id='g_menu'> <div class="g_titre"> <h1>Informations diverses</h1> </div><br /><br /> <li><a href='#'>lien 1</a></li> <li><a href='#'>lien 1</a></li> </ul> <div> <a href="#"> <img class="center" src="images/ban.png" alt='image' title='image' /></a> <br /> </div>
Ce code marche à la perfection sous FIREFOX et le cauchemard commence sous ie !
La solution temporaire que j'ai utilisé c'est de placer manuellement les images avec une margin-left: 5px; mais sa m'amuse de me compliquer la vie
Merci de vos illuminations...
