Ссылки вокруг картинки [закрыто]

*, 
*:before, 
*:after { 
  box-sizing: border-box; 
} 
 
.btn { 
  display: inline-block; 
  vertical-align: middle; 
  padding: .5rem 1rem; 
  text-transform: uppercase; 
  color: #fff; 
  background: #5b667a; 
  text-decoration: none; 
  margin: 1rem 2rem; 
} 
 
.row { 
  text-align: center; 
  overflow: hidden; 
} 
 
.left { 
  width: 25%; 
  float: left; 
} 
 
.right { 
  width: 25%; 
  float: right; 
} 
 
.center { 
  width: 50%; 
  float: left; 
} 
 
img { 
  max-width: 100%; 
  width: 100%; 
  height: auto; 
}

<div class="row"> 
  <a href="#" class="btn">button</a> 
  <a href="#" class="btn">button</a> 
</div> 
<div class="row"> 
  <div class="left"> 
    <a href="#" class="btn">button</a> 
    <a href="#" class="btn">button</a> 
    <a href="#" class="btn">button</a> 
    <a href="#" class="btn">button</a> 
  </div> 
  <div class="center"> 
    <img src="http://cliparts.co/cliparts/yTk/Kz6/yTkKz6LAc.jpg" alt=""> 
  </div> 
  <div class="right"> 
    <a href="#" class="btn">button</a> 
    <a href="#" class="btn">button</a> 
    <a href="#" class="btn">button</a> 
    <a href="#" class="btn">button</a> 
  </div> 
</div>   
<div class="row"> 
  <a href="#" class="btn">button</a> 
</div>