Div seems wierd

Why does #column div have so much whitespace above it? Why is there so much space between it and the bottom of the <h1>?

Sorry must have misread your post I thought you were referring to the top margin

The space is because the form elements are clearing the floated .cleft and .cright elements that you are using for the gradient.

You should have applied the gradients as a single background image to a parent rather than adding two floated elements like that which are always going to give you trouble.

You could have placed then into position absolutely so they are removed from the flow but it would be much neater to simple use one wrapper and paint both sides at once as a background image on that wrapper and not mess up the space that you are placing elements into.

You can probably fix it like this anyway but it’s not the way I would have done it .


Ya, i’ll do it the best way, to make 1 wrapper div.instead opf floating the background divs

Question: I’m trying to figure out how the best way could be done
After the horizontal menu div closes, I think i’d add
<div id=“mid_wrapper”>
<div id=“mid”>
//add all content here

then have the background for mid_wrapper the 2 images (http://mvsr.org/images/mid_lt.jpg, and http://mvsr.org/images/mid_rt.jpg, as 1, but spread apart 900px, choose noheight for it but have a background-position:top and make sure it doesn’t repeat) then have mids background http://mvsr.org/images/mid_bg.jpg
or is there another way?

That sound about correct except the repeating background needs to be on the first wrapper because it would rub out the gradient image otherwise. :slight_smile: The gradient is placed last and sits on top of the repeating image. Once the content is larger than the gradient the repeat then comes into effect where the gradient has fnished.