html - text moves to different div: css -
here plunkr:
the issue div
https://plnkr.co/edit/hhsreat6glynztf4qojj?p=preview
<div class="main-page"> <div class="container"> <div class="row"> <div class="col-xs-6 welcome-text">ankur chavda</div> <div class="col-xs-4 intro">programmer, singer song-writer, football</div> </div> </div> </div> you can see css classes in plunkr.
thanks in advance.
remove line height from:
.main-page { background-color: #293b4d; width: 100%; height: 90vh; /* text-align: center; */ /* vertical-align: middle; */ } if want 2 div elemnts centered main-page can try this:
.main-page{ background-color: #293b4d; width: 100%; height: 90vh; /* text-align: center; */ /* vertical-align: middle; */ position:relative; } .holder { width: 100%; position: absolute; top: 50%; transform: translatey(-50%); } and add div element class named "holder" parent of row this:
<div class='holder'> <div class="row"> <div class="col-xs-6 welcome-text">ankur chavda</div> <div class="col-xs-4 intro">programmer, singer song-writer, football</div> </div> </div> hope work.
here screenshot:

Comments
Post a Comment