¿Espacio restante entre los elementos (botones) con "margen: 0"?

Question

http://jsfiddle.net/TRVfh/2/

Una imagen:

Por lo tanto, en este momento, hay un poco de GAM entre los dos botones. y me gustaría que los botones compartan el borde del medio, o al menos tocar (si están tocando, cambiar el CSS para que parezca que están compartiendo un borde no es difícil)

Pero el margen izquierda/la derecha no parece hacer nada. ¿Qué está pasando aquí?

Answer 1

Los dos botones tienen un espacio entre ellos debido al retorno y la sangría que utilizó para formatear el código HTML.

simplemente flotar ambos recipientes: http://jsfiddle.net/TRVfh/19/

.redline_changes, .redline_comments{ 
    margin-left: 0px; 
    margin-right: 0px; float: left; 
} 

Answer 2

I fixed this agregando margin-left: -5px al segundo botón.

Answer 3

Basta con retirar ningún espacio entre el DIV:

<div class="redline_changes"> 
     <a href="#">Left Button</a> 
    </div><div class="redline_comments"> 
     <a href="#">Right Button</a> 
    </div> 

Answer 4

Parece espacios en blanco extra en el código HTML. http://jsfiddle.net/TRVfh/18/

Answer 5

El espacio es causado por la nueva línea y la sangría entre los dos div internos. Al quitar el espacio en blanco los acercará más.

<div class="shell" style="width: 950px; "> 
     <div class="redline_changes"> 
      <a href="#">Left Button</a> 
     </div><div class="redline_comments"> 
      <a href="#">Right Button</a> 
     </div> 
</div> 

Answer 6

Es el único carácter de espacio que se inserta automáticamente por la normalización. Por desgracia, para solucionarlo, que necesita para arruinar su formato de código:

</div><div class="redline_comments"> 
      <a href="#">Right Button</a> 
     </div> 

Here's a demo.

Answer 7

Trate de añadir display:inline (en lugar del actual display:inline-block;)

http://jsfiddle.net/D269S/

Probado en Chrome , Firefox, Opera e IE.

Answer 8

uso display:flex;
flex significa diseño flexible.

Answer 9

puede utilizar un espaciador con toda 0

.example-spacer { 
    flex: 0 0 0; 
} 
or 
.example-spacer { 
    flex: 0 0 auto; 
} 
or 
.example-spacer { 
    flex: auto; 
}