JSFiddle - React, Tailwind, and code Playground

HTML

<div>
        <div class="stock_left">
            <a href="#"><img src="http://placehold.it/400x500" alt="stock"></a>
        </div>
  		<div class="stock_center">
          <div class="regist">
              <img src="http://placehold.it/400x240" alt="regist">
          </div>  
          <div class="socnet">
              <img src="http://placehold.it/400x240" alt="regist">
          </div>
         </div>
        <div class="stock_right">
            <img src="http://placehold.it/400x500" alt="stock">
        </div>
</div>

CSS

.stock_left {
    float: left;
    overflow: auto;
    width: 30%;
    height: 504px;
    margin: 20px 1% 20px 4%;
}
.stock_left>a>img, {
    width: 100%;
    max-height: 500px;
}
.stock_center {
  float: left;
  width: 30%;
      height: 244px;
      margin: 20px 1% 20px 0;
}

.stock_right {
    float: left;
    overflow: auto;
    width: 30%;
    height: 504px;
    margin:20px 4% 20px 0;
}

img {
  max-width: 100%;
  height: auto;
}