Skip welcome & menu and move to editor
Welcome to JS Bin
Load cached copy from
 
<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <title>JS Bin</title>
</head>
<body>
  
<h3>1. display: inline-block;</h3>  
  
<div class="ib">
  <img src="https://assets.toptal.io/uploads/blog/category/logo/77/web.png">
  <div class="logo-text">Текст<br>
    <span>текст</span>
  </div>
</div>
  
  
<h3>2. display: flex;</h3>
  
<div class="fx">
  <img src="https://assets.toptal.io/uploads/blog/category/logo/77/web.png">
  <div class="logo-text">Текст<br>
    <span>текст</span>
  </div>
</div>
  
<h3>3. display: table;</h3>
  
<div class="tb">
  <img src="https://assets.toptal.io/uploads/blog/category/logo/77/web.png">
  <div class="logo-text">Текст<br>
    <span>текст</span>
  </div>
</div>
  
</body>
</html>
 
.ib {
  text-align: center;
}
.ib img,
.ib .logo-text {
  display: inline-block;
  vertical-align: middle;
}
.fx {
    display: flex;
    flex-flow: row nowrap;
    align-items: center;
    align-content: center;
    justify-content: center;
}
.tb {
  display: table;
  margin: 0 auto;
}
.tb img,
.tb .logo-text {
  display: table-cell;
  vertical-align: middle;
}
Output

You can jump to the latest bin by adding /latest to your URL

Dismiss x
public
Bin info
lime7pro
0viewers