Margin Issues

[neo]

Sorry to trouble anyone with this, but this is bothering me so much XD.

I am coding a new layout and it's set up in div.

I have them auto-centered on the page using ' margin: 0 auto; ' in the container div, as well as subsequent other divs:

Code: Select all

#container {
margin:0 auto;
width: 800px;
}

#header {
width: 800px;
height: 430px;
}

#content {
margin: 0 auto;
width: 725px;
text-align: justify;
font-family: Century Gothic, sans-serif;
font-size: 12px;
color: #7D7D7D;
letter-spacing: 2px;
}

#footer {
margin: 0 auto;
width: 725px;
text-align: justify;
font-family: Century Gothic, sans-serif;
font-size: 12px;
color: #7D7D7D;
letter-spacing: 2px;
}

My issue is that my div's are spaced too far apart. I tried to adjust the 0 in the margin, but then the auto-center is off. This usually isn't a problem for me and somehow it is this time?
Does anyone know how I could a.) do this with the existing code or b.) a better code for auto-center that will allow me to adjust the top margin as needed XD.

Thank you in advance! <3

Edit: I've tried using margin-left: auto; + margin-right: auto; and margin-top: -10px;
but it threw everything off and didn't even close the space. :/

[Mikari]

I usually use margin:0px; for the divs inside and center only the container with margin:0px auto 0px auto; so that everything inside it is also centered. Maybe adding a padding:0px; to the outer divs would help? Might have something to do with the different widths for each div. I'm not sure seeing only the CSS but I can certainly identify with this happening. XD

[neo]

Ah, Mikari, the padding 0px worked! Thank you so much!! ^-^.

I also added this in my css:

Code: Select all

* {margin: 0; padding: 0; border: none;}

And, it seems to have done something XD.

/codingfailures

*hugs~*

[Mikari]

Awesome ^^ I'm glad you figured it out. :D