stupid tables!!
- Started
- Last post
- 19 Responses
- leftwave
can anyone help me figure out why there is a big gap in the table on this design?
http://leftwave.com/indevelopmen…
it looks fine in firefox, but in internet explorer, there is a 4 pixel high gap under the logo. here is a screenshot:
thanks for looking :)
- jonatne0
good lord
- uan0
maybe using a newer version of dreamweaver can solve...
...debugging dw code is not for humans...
- ********0
tried to clear any unnecessary spaces and tabs? it screws tables up.
- rootlock0
you have pixel shift issues also on firefox.
- 7point340
the problem aside from shitty bulky code is that all browsers handle tags an itty bit differently. which is a headache to say the least but manageable when you're only dealing with a 1 or 2 px difference between p tags,
but what if you use tables and you have to worry about the quirks of several tags? table th td tr theader tbody... etc. even with a global reset you can't control completely how browsers render these things.
and some browsers don't understand all the css equivalent properties, like cellspacing. (can't remember what it is in css, but it's not margin) and then there are issues with bordercollapse: some browsers do this by default, some don't.
learn css div positioning and don't deal with tables no more
- scarabin_net0
dammit, i've come in here twice thinking it was a furniture thread.
- ********0
Did you build the CSS and or tables-within-tables from scratch or is it mostly based on a foxycart template (if such a thing exists, which I'm assuming it does...)? Looking at the code, there's a lot of room for error between your inline styles, your linked styles, and/or hardcoded table properties.
This could be much cleaner as XHTML and CSS, purely. I know that doesn't help your current problem, but if you're not too far into development this may be something to consider.- Just noticed: <!-- This table was automatically created with Macromedia Fireworks -->
!!!********
- Just noticed: <!-- This table was automatically created with Macromedia Fireworks -->
- neverblink0
The problem is with the one pixel shift left/right is because your header image isn't the same width as the table. The browser will determine the center based on the width of the object (center=(width of window - width of object)/2). The center will be rounded to whole numbers (can't have half pixels) which makes the header shift in relation to the body.
As for the horizontal gutter.. it's the background showing through.
Try deleting the whitespaces (tabs and newlines) in this part:
<map name="index_r1_c1Map">
<area shape="rect" coords="88,74,338,179" href="../index.html">
</map>
Sometimes Internet Explorer shows a horizontal space when there are tags or whitespace in the code that shouldn't show up in the design.
If that doesn't work, try adding padding-bottom:0; and margin-bottom:0; to your header-container.
- harmsie0
holy bejesus, I hope this is site is just for demonstration purposes and isn't going to be relased in to the wild using tables? Sorry that's not of any help mainly cos I can't use tables...looking at it though it wouldn't take too much to get that in to Html/CSS
- leftwave0
thanks everyone for dealing with me and my stupid tables!
i used a bit of CSS and think i got rid of the gap. can you check this in your browser please??
http://leftwave.com/indevelopmen…
- harmsie0
gap has gone in IE7, FF2 and Safari, but still have the pixel shift to the right, or are you not worried about that
- ********0
http://ipinfo.info/netrenderer/i… faster but only for IE preview.

