CSS - My Awesome Moments

I want to center the text horizontally with top margin I tried few options example text-align: center; but it doesn’t work.

So below is the solution:

The CSS to Align Center the Text

<style>
.align-center-with-top-margin{
/*u can change the top margin*/
top: 18%; 

/* to make text align center */
left: 50%;
transform: translate(-50%, -50%);
margin: 0;
width: 100%;
}
</style>

<style>

.align-center-with-top-margin{

/*u can change the top margin*/

top: 18%;

/* to make text align center */

left: 50%;

transform: translate(-50%, -50%);

margin: 0;

width: 100%;

}

</style>

The HTML Code

<div class="align-center-with-top-margin">
      Undangan  
</div>

Undangan

</div>

The Output of Text Align Center with Top Margin

css text align center horizontally with top margin - 8 characters — css text align center horizontally with top margin – 8 characters

css text align center horizontally with top margin - 14 characters — css text align center horizontally with top margin – 14 characters

css text align center horizontally with top margin - 15 characters — css text align center horizontally with top margin – 15 characters

Tag: CSS

CSS Text Align Center Horizontally with Top Margin

The CSS to Align Center the Text

The HTML Code

The Output of Text Align Center with Top Margin