Lofty90
05-03-2010, 12:30 PM
Hey guys,
I having a problem with CSS and its really putting a halt on my progress.
Basically, I cannot seem to get a box to align correctly on my pages. I have tried everything but no joy. I was wondering if anyone could have a look at the screeny i've taken and possibly shed any light onto the issue?
http://www.sallen90.byethost11.com/
Many thanks,
Scott Allen.
WickedFactor
05-03-2010, 12:31 PM
Without seeing your code, no one can tell you how to fix it. Do you have a link to the live site?
Lofty90
05-03-2010, 12:33 PM
Without seeing your code, no one can tell you how to fix it. Do you have a link to the live site?
Oh of course, sorry about that.. http://www.sallen90.byethost11.com/
Thanks,
Scott.
WickedFactor
05-03-2010, 12:44 PM
Take <div id="footer"> out of <div id="bodyBottom">.
Lofty90
05-03-2010, 12:48 PM
That doesn't work I'm afraid,
that just removes the box and some text...
larwilliams
05-03-2010, 12:56 PM
When you say "align correctly", what exactly do you mean?
You do realize that the CSS box model is that padding and borders are in addition to whatever width you specify, right? I've seen quite a few devs make that mistake when first learning to write modern HTML code.
WickedFactor
05-03-2010, 12:59 PM
You forgot to close the bodyBottom div.
That should do it. Sorry about before, I just viewed your source code via firebug. I just checked the actual source, and the bodyBottom div isn't closed.
Lofty90
05-03-2010, 12:59 PM
I mean, the bottom dark box doesn't sit properly within the white main section as it should, it is sitting slightly up and to the right.
larwilliams
05-03-2010, 01:00 PM
You may also want to fix up your html errors as well, like nesting divs inside of <font> tags (which nobody should be using anymore).
Lofty90
05-03-2010, 01:01 PM
You forgot to close the bodyBottom div.
That should do it. Sorry about before, I just viewed your source code via firebug. I just checked the actual source, and the bodyBottom div isn't closed.
Awesome!
That has fixed it.
Thank you so much!
larwilliams
05-03-2010, 01:04 PM
I mean, the bottom dark box doesn't sit properly within the white main section as it should, it is sitting slightly up and to the right.
This is because your padding on bodyBottom is pushing it that way because of it's "padding" attribute. The easiest solution to to take the footer div out of bodyBottom and set it's width to be the same (and margin:0px auto;) to align them the same way horizontally.
And yes, the tag isn't closed too :)
