How to Arrange Social Buttons Like Twitter and Facebook Horizontally or Vertically

Tadashi Shigeoka ·  Sat, February 9, 2013

A snippet memo for arranging social buttons like Twitter and Facebook horizontally.

■ HTML


■ CSS

●Horizontal arrangement

.socialButtons {
  overflow: hidden;
}
.socialButtons li {
  float: left;
  margin-right: 10px;
}
.socialButtons iframe {
  margin: 0 !important;
}

●Vertical arrangement

.socialButtons {
  list-style-type: none;
  padding-left: 0;
}
.socialButtons li {
  margin-bottom: 4px;
}
.socialButtons iframe {
  margin: 0 !important;
}

・[Reference] Arranging Social Buttons Like Twitter and Facebook Horizontally ‹ CSS - hostingjedi

That’s all from the Gemba.