HTML/CSS Help!

JosephDuffy · 10 Jun 2012 at 19:53

spenncerr said:
How can I get them to be above the wrapper but still stay in line with the wrapper no matter what resolution or size of the web browser?

As I said, wrap it in a header tag and apply the same rules as the wrapper has.
I have done so here, but just removed the height, padding, background and border.
If that's not what you're looking for, then I got the wrong idea, so sorry.

spenncerr · 11 Jun 2012 at 07:10

JosephDuffy said:
As I said, wrap it in a header tag and apply the same rules as the wrapper has.
I have done so here, but just removed the height, padding, background and border.
If that's not what you're looking for, then I got the wrong idea, so sorry.

Oh christ, I misread what you actually put. My apologies!

This words perfectly, thank you. Why is it that this works?

JosephDuffy · 11 Jun 2012 at 16:43

spenncerr said:
Oh christ, I misread what you actually put. My apologies!

This words perfectly, thank you. Why is it that this works?

I'm probably not the best at explaining CSS, but here goes.
The main things that "place" the header and wrapper divs are the width and the margins. Having a left and right margin of "auto" with auto-center the div (I believe it essentially sets the margins to 0.5*(width of div at 100% width - current width), but that's probably not how it actually does it).
Because both divs have the same width and auto-margins, they both line up perfectly.
The reason I said to add the header to inside the wrapper is that if you change any aspects of the wrapper (such as make it a fluid design), you wouldn't have to change the header, too. However, this would require styling (such as removal of the background) for the header, or further wrapping. On my personal projects, I use a wrapper for the whole page (keeping it all in line with each other), and then a main-content container. Hope this helps, but I'm sure someone else will be able help you a little better