6 replies [Last post]
iSilver
iSilver's picture
Offline
newbie
Last seen: 14 years 40 weeks ago
Timezone: GMT+10
Joined: 2007-09-03
Posts: 4
Points: 0

Hi Folks

I have been working on a CSS layout to update one of my existing sites and have come across a problem that has got me stumped. The issue is that only IE browsers (6 & 7) are rendering 3-4 inches of whitespace between the opening paragraph of text and a table I have inserted on the page.

You can see what I am talking about here: http://www.universalwonderland.com/jefflang_web/tour.php

http://www.universalwonderland.com/jefflang_web/assets/css/jefflang_screen.css
http://www.universalwonderland.com/jefflang_web/assets/css/jefflang_screen_tour.css

The CSS information used for the table on this page is contained in the second link.

Thanks in advance for any advice,
iSilver

gary.turner
gary.turner's picture
Offline
Moderator
Dallas
Last seen: 1 year 47 weeks ago
Dallas
Timezone: GMT-6
Joined: 2004-06-25
Posts: 9776
Points: 3858

I suspect that putting h3s

I suspect that putting h3s in your captions are causing trouble. They're not allowed there.

Please fix that and the other html markup errors. It is really a Sisyphean labor to try to debug invalid markup.

cheers,

gary

If your web page is as clever as you can make it, it's probably too clever for you to debug or maintain.

iSilver
iSilver's picture
Offline
newbie
Last seen: 14 years 40 weeks ago
Timezone: GMT+10
Joined: 2007-09-03
Posts: 4
Points: 0

Cleaned the pages but still getting excess whitespace

Thanks for being so pointed in your response - I've taken your advice and cleaned the html and css for this site and both now pass validation (including CSS Level 3 (it's got some drop-shadows), see the links at the bottom of the page to validate) but I am still getting this large whitespace in IE7 on Vista.

Thanks in advance for any comments,
Gary

wolfcry911
wolfcry911's picture
Offline
Guru
MA, USA
Last seen: 8 years 47 weeks ago
MA, USA
Timezone: GMT-5
Joined: 2004-09-01
Posts: 3224
Points: 237

reduce the table widths by

reduce the table widths by 1px

cbserra
cbserra's picture
Offline
newbie
Last seen: 4 years 3 weeks ago
Timezone: GMT-5
Joined: 2007-09-04
Posts: 5
Points: 0

Have you tried wrapping the

Have you tried wrapping the <p> around the <table> ? Usually after a paragraph, there's a decent amount of space between it and the next element. Just a suggestion though.

Ed Seedhouse
Ed Seedhouse's picture
Offline
Guru
Victoria British Columbia
Last seen: 1 year 49 weeks ago
Victoria British Columbia
Timezone: GMT-8
Joined: 2005-12-14
Posts: 3570
Points: 675

cbserra wrote:Have you tried

cbserra wrote:
Have you tried wrapping the <p> around the <table> ? Usually after a paragraph, there's a decent amount of space between it and the next element. Just a suggestion though.

Don't do that!!! TABLE is illegal inside P. P cannot contain any block elements. P is for marking up paragraphs. Paragraphs are for marking up text and allowed to contain only text-like content.

Ed Seedhouse

Posting Guidelines

Watch out! I am carrying irony, sarcasm and satire, and know how to use them.

iSilver
iSilver's picture
Offline
newbie
Last seen: 14 years 40 weeks ago
Timezone: GMT+10
Joined: 2007-09-03
Posts: 4
Points: 0

Problem Fixed

:thumbsup:

wolfcry911 wrote:
reduce the table widths by 1px

That's the advice that fixed the problem (though I reduced the table size by 5px).

I assume the 3 colum widths PLUS margins PLUS padding must have equalled more than the width of the container of these div's.

I'd be interested to know how you determined that this was the problem please Wolfcry911. Thanks again.