Fronteira colapso sem tabelas

Às vezes, o conteúdo com borda deve ficar próximo a outro conteúdo com borda. Se cada elemento usar borda, as bordas dobrarão. Considere o uso de contorno ou sombra de caixa para obter o mesmo efeito, mas sem sobrepor bordas.

/* this might not go so well if another bordered element is next to it */
.thingy {
  border: 1px solid #DDDDDD;
}
/* rgba is great, but keep in mind that overlapping borders will be added together to create a darker shade */
.thingy {
  outline: 1px solid rgba(0, 0, 0, 0.1);
}
/* classic but works */
.thingy {
  outline: 1px solid #DDDDDD;
}
/* this works too */
.thingy {
  -moz-box-shadow: 0px 0px 0px 1px #DDDDDD;
  -webkit-box-shadow: 0px 0px 0px 1px #DDDDDD;
  box-shadow: 0px 0px 0px 1px #DDDDDD;
}

Para obter mais dicas de CSS, visite Semantic UI CSS Guide