How can i place <div> in center horizontally which is inside another <div> using CSS?
I don't want to use position:absolute property
Example code:
<div class="MainDiv">
<div class="InnerDiv">
Place this in center
</div>
</div>
Answered by:- vikas_jk
You can simply place horizontally aligned div inside div(without using position: absolute) by using margin:0 auto property in CSS
Code
.MainDiv{
width: 100%;
}
.InnerDiv{
display: table;
margin: 0 auto;
}Another alternative method to horizontally centralizing div is using the below css code
CSS
.MainDiv{
width: 100%;
text-align: center;
}
.InnerDiv{
display: inline-block;
}the above code will place .InnerDiv in the middle
Subscribe to our weekly Newsletter & Keep getting latest article/questions in your inbox weekly