CH3-3 boostrap置中

## row>.col-sm-4(圖片)+.col-sm-4(文字)

這樣的排列方式文字對齊圖片垂直至中

row裡面加上row-eq-height

HTML

<div class="row row-eq-height"> <div class="col-sm-4"> <img src="" alt="" class="img-responsive"> <div class="col-sm-4"> <p>testtesttesttesttesttesttesttesttesttesttesttesttesttest</p> </div> </div> </div>

CSS

@media screen and (min-width:768px){
.row-eq-height {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display:         flex;
  align-items: center;
}
.row .row {
  margin-top: 10px;
  margin-bottom: 0;
}
[class*="col-"] {
  padding-top: 15px;
  padding-bottom: 15px;
}

results matching ""

    No results matching ""