H. Reit H. Reit - 3 months ago 6
CSS Question

What is the best way to position a img and a div side by side and center them?

se are working on a website since some days and have a problem right now.
We try to position a img and a div side by side, which I reached but I found no solution to have 2 texts sepertly and centered verticaly in the div.

My question is how do I get a similar result as on this picture?
This is a snippet of a site i found

I searched in the markup of the site how it is done and recognised that it was made with disply type "table-cell", I tryed to build it but i failed.

I hope you can help me
Thank you in advance

Answer

try Flexbox: "life made simple";

.container {
  display: flex;
}
.container div {
  flex: 1 1 auto;
}
<div class="container">
  <img src="http://placehold.it/50">
  <div>
    <div>Your Name here</div>
    <div>second div</div>
  </div>
</div>