Friday, March 4, 2016

align items center horizontally and vertically using css




In this tutorial i am going to use three css properties to align the text or image center, most of the designers who don't know they often use margin-top, line-height etc. But thats not the perfect solution so just take few minutes to apply this in your designs its really helpful.


Step - 1 : CSS

html,body{
  height: 100%
}

.container{
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}

Step - 2 : HTML

<div class="container">
    <h4>This is a sample text</h4>
</div>


Finished.


No comments:

Post a Comment

Copyright © www.sureshsharma.info All rights reserved