How to set div in vertically center in Html or Css

Question

<ion-view class="ion" view-title="Browse">
  <ion-content class="content" >
    <div class="list  landing-div">
      <img class="landing-image" src="img/slpash_logo.png" >

      <div class="row sub-div">
        <div class="col">
          <button class="button icon-left ion-person button-full landing-button-left" type="submit">LOGIN</button>
        </div>
        <div class="col">
          <button class="button icon-right ion-android-list button-full landing-button-right" ui-sref="#/app/register" type="submit">SIGNUP</button>
        </div>
      </div>
    </div>

  </ion-content>
</ion-view>

In the div two button and on image now how to set div in vertically center.

Related - http://stackoverflow.com/questions/396145/how-to-vertically-center-a-div-for-all-browsers?rq=1 — Paulie_D, Jun 01 '16 at 11:54
Without seeing your CSS, are you trying to achieve something like this: https://jsfiddle.net/48sz07kz/ — David Wilkinson, Jun 01 '16 at 11:55

score 0 · Answer 1 · answered Jun 01 '16 at 12:03

<ion-view class="ion" view-title="Browse">
  <ion-content class="content" >
    <div class="list  landing-div">
      <img class="landing-image" src="img/slpash_logo.png" >
div{
vertical-align: text-top;
}
      <div class="row sub-div">
        <div class="col">
          <button class="button icon-left ion-person button-full landing-button-left" type="submit">LOGIN</button>
        </div>
        <div class="col">
          <button class="button icon-right ion-android-list button-full landing-button-right" ui-sref="#/app/register" type="submit">SIGNUP</button>
        </div>
      </div>
    </div>

  </ion-content>
</ion-view>

How to set div in vertically center in Html or Css

1 Answers1