How to add partner logos


(Olli Ovaskainen) #1

Hi,

Any ideas how to add 5-6 logos in home page?
They need to be horizontal, same size and responsive.

I try this and its look good, but it is not responsive

CSS:
body {
margin: 0;
}

#partners {
  height: 105px;
  background-color: #eee;
  white-space: nowrap;
  width: 100%;
  display: table;
}

.logo-image {
  vertical-align: middle;
  padding: 13px;
  display: table-cell;
}

.logo-image img {
  max-width: 100%;
}

html:

<div id="partners">
  <div class="logo-image">
    <img src="http://placehold.it/120x80" alt="Placeholder Image" />
  </div>
  <div class="logo-image">
    <img src="http://placehold.it/120x80" alt="Placeholder Image" />
  </div>
  <div class="logo-image">
    <img src="http://placehold.it/120x80" alt="Placeholder Image" />
  </div>
  <div class="logo-image">
    <img src="http://placehold.it/120x80" alt="Placeholder Image" />
  </div>
  <div class="logo-image">
    <img src="http://placehold.it/120x80" alt="Placeholder Image" />
  </div>
  <div class="logo-image">
    <img src="http://placehold.it/120x80" alt="Placeholder Image" />
  </div>
</div>