Table borders sometimes won’t show in FF?

@cusimar9Feb 13.2006

Sometimes the borders of my tables won’t show properly in Firefox. Usually when I’m retrieving more than a handful of records

It seems to be related to the way the page loads. In IE I set the page buffering to true so that the browser waits until it has all the data before displaying it. Firefox however seems to insist on loading it as it arrives and as a result it messes up the drawing of the borders.

Its only on the top few rows as well, the last rows seem to be fine.

Any suggestions?

to post a comment

CSS

21 Comments(s) _↴

@toicontienFeb 13.2006 — #That's a very common glitch in Gecko based browsers, and I think it has something to do with the [url=http://www.positioniseverything.net/gecko/mozshift.html]Gecko Shifting Gaps 'n Overlaps bug[/url]. Note that many browsers suffer from this behavior once in a while. It also can have something to do with the order in which you specify the borders of table cells.

@cusimar9authorFeb 13.2006 — #Hmm... I don't have a 'line-height' property specified in any of the affected divs though...

[url=http://www.firstchoicevacationhomes.com/listproperties.asp?locationA=1]Clicky[/url]

@drhowarddrfineFeb 13.2006 — #In IE I set the page buffering to true so that the browser waits until it has all the data before displaying it.[/QUOTE]Where do you do this? This is the default for IE.

@cusimar9authorFeb 14.2006 — #Oh yeah... well I just meant I had a play around with it

@Orc_ScorcherFeb 14.2006 — #Are your tables using collapsed borders? If yes, a workaround is to attach a basically empty binding to these tables.

@cusimar9authorFeb 14.2006 — #Yes I am using collapsed borders... how do you mean attach an empty binding?

@DoppleFeb 14.2006 — #? Nice site.

@drhowarddrfineFeb 14.2006 — #Validate your html and, especially, your css. You have errors in your css that may be affecting this.

@Orc_ScorcherFeb 14.2006 — #Yes I am using collapsed borders... how do you mean attach an empty binding?[/QUOTE]Add the following declaration to your table's style rule:

-moz-binding: url(binding.xml#dummy)

And you need a new file 'binding.xml':

&lt;?xml version="1.0"?&gt;
 &lt;bindings xmlns="http://www.mozilla.org/xbl"&gt;
 &lt;binding id="dummy"&gt;
 &lt;content/&gt;
 &lt;/binding&gt;
 &lt;/bindings&gt;

I can't guarantee that this works all the time but I've had good success with it.

@drhowarddrfineFeb 14.2006 — #Talk about a hack.

@cusimar9authorFeb 14.2006 — #:) Nice site.[/QUOTE]

Thanks ? Its taken ages but its nearly there now...

drhowarddrfine I've just checked and fixed a couple of CSS errors...

Orc Scorcher I don't know WHAT that is lol I'll give it a try if I can't figure out another way

@drhowarddrfineFeb 14.2006 — #So now I don't see any border issues. Am I missing something?

Orc is using xml to fix a html table. That's why I say that's a ridiculous hack unless I'm misunderstanding something somewhere.

@cusimar9authorFeb 14.2006 — #Sorry drhowarddrfine, I keep tweaking the website. I've hacked it to show up the error again

It only seems to happen when I display a LOT of records, here its 500.

The pages now passes HTML 4.01 STRICT, and the CSS Validates as well

This is really weird

@drhowarddrfineFeb 14.2006 — #I'm running out the door but check to see if your image isn't covering up the border on the left. Maybe make it thinner or remove it.

EDIT: In fact, your images are covering up the left border. Can't look into it myself right now.

@cusimar9authorFeb 14.2006 — #Thanks, but I don't think its the images. If you scroll to the very bottom you'll see which borders you SHOULD be able to see... there's borders everywhere and they're ALL invisible

@FangFeb 14.2006 — #Too big a table and way too much css for FF to handle.

Place all css in the external css.

Optimize the table styles; whichever class is used the most use as the td rule.

I can understand stress testing the layout, but 500 houses. No-one would want to look at more than 20 houses. Maybe 5 houses on a page with the option to make a selection to show on another page. Just an idea.

@Orc_ScorcherFeb 14.2006 — #The problem is that collapsed borders and incremental reflow don't play nice together. The little trick with the binding is supposed to delay the rendering until the table is complete but in the case of your huge table the delay isn't long enough to have an effect.

I could adjust the binding so the table is only rendered after the page is complete, that fixes the border problem but it makes the page look a bit empty while it's still loading. Pick your poison.

@cusimar9authorFeb 14.2006 — #Hmmm... the problem I guess only became apparent in the ADMIN section where I DO have all the houses displayed at the same time...

I'll remove the CSS from the page, that'll give it much less to load as well

@cusimar9authorFeb 15.2006 — #Right this is ridiculous...

I've limited the number of records to 10 per page, the page validates as 4.01 Strict, I've removed all CSS to an external file yet it STILL won't display properly in CSS

This is the link...

[url=http://www.firstchoicevacationhomes.com/listproperties.asp?locationA=1]CLICKY[/url]

Try hitting "refresh" a few times and I guarantee the table borders will dissappear...

@FangFeb 15.2006 — #No problems ...

@cusimar9authorFeb 15.2006 — #lol typical its not doing it any more

Cheers Guys ?

Also in #CSS _↴

Float Left Obstruction Help a non-programmer out CSS Positioning Error

Success!

Help @cusimar9 spread the word by sharing this article on Twitter...

Tweet This

Table borders sometimes won’t show in FF?

21 Comments(s) _↴

Also in #CSS _↴

Success!

Social

Version

Table borders sometimes won’t show in FF?

21 Comments(s) ↴

Also in #CSS ↴

Success!

The web is an endless sea of information. Don't miss the boat... Subscribe!

Social

Version

21 Comments(s) _↴

Also in #CSS _↴