CSS question, not MODx related

Hi,

Can someone lend a pair of fresh eyes on this? I’m rebuilding an iframes site (http://www.gooischerun.nl) to a normal html site (http://gooischerun.textdriven.com/). I’m using the 960 grid systen, but for the life of me, I can’t get rid of the whitespace between the header and the dropline menu.

According to Chrome Inspector, hovering on <div class="grid_12"> shows the 2-pixel padding on the header element, however, there *is* 0px padding in the generated CSS.
It’s probably pretty obvious, but I can’t find it.

Any help appreciated, I’m losing it here...

try (added height:200px)

*edit: ...or less. e.g. 191px

Quote from: sharkbait at Mar 02, 2010, 03:45 PM

try (added height:200px)

.grid_12{
	display:inline;
	float: left;
	position: relative;
	margin-left: 10px;
	margin-right: 10px;
	height:200px;
}

*edit: ...or less. e.g. 191px

He, that worked! Thanks! Unfortunately, I’m using the grid_12 class twice, once for the header and then for the id="nav". Any idea how I can differentiate in CSS to which class/id combo this is applied?

Thanks again.

either add an id to the first one ( with the height set ), or add a second class to it: class="grid_12 first"
.first {height: 191px;}

Thank you sharkbait, simple and effective.