html - Keep Text Centered when resizing -




so have looked @ other questions this, yet none have solved problem. want able resize window of browser, yet keep text in centre of window.

html:

<div id=inside> navjeeven mann </div> 

css:

#inside {   position:relative;   width: 100%;   height: 100%;   font-size: 60px;   text-align: center;   color: black;   top:50%;   left:50%; } 

what looks now

to keep centred horizontally, remove top:50%;left:50%;

#inside {    position:relative;    width: 100%;    height: 100%;    font-size: 60px;    text-align: center;    color: black;  }
<div id="inside">    navjeeven mann  </div>

to center horizontally , vertically, flex job well, unless have support older browsers.

html, body {    margin: 0;  }    #inside {    display: flex;    width: 100vw;    height: 100vh;    align-items: center;    justify-content: center;    font-size: 60px;  }
<div id="inside">    navjeeven mann  </div>





wiki

Comments

Popular posts from this blog

Asterisk AGI Python Script to Dialplan does not work -

python - Read npy file directly from S3 StreamingBody -

kotlin - Out-projected type in generic interface prohibits the use of metod with generic parameter -