<ul><li> + css + (IE/firefox) = %+@&£¢$

<ul><li> + css + (IE/firefox) = %+@&£¢$ - HTML/CSS - Programmation

Marsh Posté le 01-04-2006 à 13:05:23    

Bonjour,

 

Voici un problème qui à eu raison de tous mes cheveux, rendez-moi grace en me filant un petit coup de pouce !

 

Le problème concerne les listes à puces sous IE et MOZILLA avec CSS. Voici le code source

 
Code :
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//FR"
  2.     "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  3. <html xmlns="http://www.w3.org/1999/xhtml">
  4.     <head>
  5.         <title>Arrachage de cheveux !</title>
  6.     </head>
  7.     <body >   
  8.         <style type="text/css">
  9.             body { margin: 0px; padding: 0px; }
  10.             ul   { padding-left: 0px; } /* C'est cette ligne qui me détruit ! */
  11.         </style>
  12.         <ul>
  13.             <li>Ligne 1</li>
  14.             <li>Ligne 2</li>
  15.         </ul>
  16.     </body>
  17. </html>   


Ce que je souhaite obtenir c'est un alignement identique à 2px du bord de l'écran quelque soit le navigateur employé.

 

Pourvez-vous m'aider ?


---------------
.:coin:.
Reply

Marsh Posté le 01-04-2006 à 13:05:23   

Reply

Marsh Posté le 01-04-2006 à 13:07:20    

J'ai bien une pseudo réponse mais elle ne me plait pas...
 

Code :
  1. ul {
  2.    margin-left: 7px;
  3.    padding-left: 7px;
  4. }


 
C'est tout pourri !


---------------
.:coin:.
Reply

Marsh Posté le 01-04-2006 à 13:19:32    

kalios a écrit :

J'ai bien une pseudo réponse mais elle ne me plait pas...
C'est tout pourri !


 
En quoi ne te plaît-elle pas exactement ?
 
Peut-être une solution du genre te convient mieux ?:
 


<style type="text/css">
 *   { padding:0; margin:0;}
 ul   { list-style:inside; margin-left:2px;}
</style>

Reply

Marsh Posté le 01-04-2006 à 17:01:47    

Disons que l'inversion padding et margin entre l'un et l'autre des navigateurs n'est pas des plus idéales !


---------------
.:coin:.
Reply

Marsh Posté le 02-04-2006 à 18:53:34    

sait tu que tu as aussi un margin et un padding sur le LI ?
 
donc la solution est simple :  

Code :
  1. * {margin:0; padding:0} //on vire tout
  2. ul {margin-left:7px} et basta

Reply

Sujets relatifs:

Leave a Replay

Make sure you enter the(*)required information where indicate.HTML code is not allowed