I've got a page in which I get about 80 pixels of apparently arbitrary space inserted between two sections of a page in Firefox and Safari.
http://weston.canncentral.org/web_lab/MozArbSpaceAboveBlock/problem.html http://weston.canncentral.org/web_lab/MozArbSpaceAboveBlock/TopGun.css The extra distance is between the navigation and the photo in the middle of the page -- in other words, the top photo should be up against the bottom of the nav. There's no margin set on the nav, the photo or the photo's containers. The photo (#photo) is floated left, if that's relevant. In trying to assess where the actual space is being added (the photo actually has two containers, #content1 and div classed with "constraint" below that) I tried putting borders on the photo's immediate container. Interestingly, this makes the problem go away: http://weston.canncentral.org/web_lab/MozArbSpaceAboveBlock/fix1.html At least, the border seems to remove the arbitrary extra space. Placing a border on #content1 doesn't seem to have the same effect, and reveals the space inside #content1. Interestingly, the border trick works even if you only apply border-top. This made me think of trying something else: placing an element inside #photo's container above #photo. And, sure enough, if it's a visible statically or relatively positioned block-level element: http://weston.canncentral.org/web_lab/MozArbSpaceAboveBlock/fix2.html Any idea what's going on here? This appears to be a bug -- but it happens across Safari and Moz which makes me think this might be one of the places where the standard is vague enough non-intuitive behavior gets implemented in browsers. Any fix ideas are also appreciated! Thanks, Weston ______________________________________________________________________ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
