I am struggling to find a way to center a container (div) on my webpage. I've tried various methods like using margin:auto, margin:0 auto;, margin-left:auto;, and margin-right:auto;, but none of them seem to work.
Additionally, I'm unsure about the specific use of the position tag in CSS. When should we use it?
CSS (provided in comments):
body
{
background-image:url('images/bgbody.jpg');
background-repeat:no-repeat;
background-size:cover;
margin:0 0 0 0;
padding:0 0 0 0;
}
.main /*main container*/
{
float: left;
margin: 0 auto ;
width: 1550px;
/*float:left; width:100%; height:100%; /*background-image:url('images/bgbody.jpg') ; background-size:cover;*/
/* margin-left:300px; overflow-x:false; */
}
.containermain /* container which i want to make center*/
{
float:left;
width:1000px;
background-image:url('images/bgmiddle.jpg');
/*margin: auto 0; */
background-repeat:no-repeat;
background-size:cover;
}