[SOLUCIONADO] Quitar margen entre <li>

Iballa · #1 (**permalink**) 24/03/2013, 10:02

Hola, estoy haciendo una lista de 6 cajas, disponiendolas 3 arriba y 3 abajo.

el caso es que quiero que estas cajas (<li> se vean pegadas y no con la pequeña
separacion que tienen entre si las <li>, pero no estan separadas las<ul>, que sí se
ven pegadas, como yo quiero. (voy a poner fotos y otros elementos en las cajas y quiero que se pegen)

¿alguien sabe como quitar esa separacion entre las <li>? Gracias de antemano

Aquí dejo el codigo:

Código HTML:

Ver original<!DOCTYPE HTML>
<html lang="es" dir="ltr">
<head>
    
 
    <meta charset="utf-8"/>
       
    <style>
      * {
        border:0;
        margin:0;
        padding:0;
      }
      
      body {
        background:pink;
      }
      
      .cuatro {
         background: crimson;
         display: inline-block;
         
      }
      ul {
         list-style:none;
      }
    
    </style>
</head>
<body>
    
    <section id="wrap">
    
      <section class="dos">
         <ul class="tres">
            <li class="cuatro">xxxx</li>
            <li class="cuatro">xxxx</li>
            <li class="cuatro">xxxx</li>
            
         
         
         </ul>
         <ul class="tres">
            <li class="cuatro">xxxx</li>
            <li class="cuatro">xxxx</li>
            <li class="cuatro">xxxx</li>
         </ul>
      </section>
    
    </section>
    
 
</body>
</html>

pzin · #2 (**permalink**) 24/03/2013, 10:29

Lo más limpio es flotar esos elementos con float:left.

Y algo más sucio es aplicarles márgenes negativos.

Iballa · #3 (**permalink**) 24/03/2013, 13:30

Gracias Bonez. Genial¡ por cierto, ¿"float" funciona para el responsive design? Es por
eso por lo que usaba el "display".

pzin · #4 (**permalink**) 24/03/2013, 13:32

Cita:

Iniciado por Iballa

Gracias Bonez. Genial¡ por cierto, ¿"float" funciona para el responsive design?

¿Es que sabes de alguna propiedad de CSS que no sirva para RWD? RWD al final es sólo una técnica, nada técnico.