View Full Version : top margin shifts with pages using Cool dhtml tooltip in Firefox

09-19-2005, 08:53 PM
I've been trying to set a consistent top margin for the pages listed below. I ordinarily wouldn't care that the tables don't appear in the identical position, but these pages appear within a frame and these shifts are annoying and very noticeable.

At this point, the top margin is set within the frameset and not on any of the individual pages (since this didn't fix the height shifts anyway).

I'm beginning to think the culprit is what is in the tables themselves because, in Firefox, the two pages called "content" that use the Cool dhtml tooltip (http://www.dynamicdrive.com/dynamicindex5/dhtmltooltip2.htm) are positioned higher than the other pages (that use 2 different types of form codes).

Inconsistency in Firefox:
content (http://www.pret-a-lingo.com/email/cartoons/space/content.htm) (dhtml tooltip)
form2 (http://www.pret-a-lingo.com/email/cartoons/space/ex3.htm) (second form code)

In Explorer, this problem also occurs, but it is all the pages using a particular form code that appear higher than the others.

Inconsistency in Explorer:
content (http://www.pret-a-lingo.com/email/cartoons/space/content.htm) (dhtml tooltip)
form1 (http://www.pret-a-lingo.com/email/cartoons/space/ex1.htm) (first form code)

I realize this is only partially a dynamic drive script question, but if anyone has any suggestions about making my top margins consistent, I would be immensely grateful! :confused:

09-20-2005, 05:14 AM
Mozilla (what current FF and NS are based on) treats margins differently than IE. It also sets a different default margin for a page. These inconsistencies are of little importance with pages such as yours because very few people will launch the pages in both browsers and switch back and forth to check. If they do, it really is their problem, not yours. The pages look fine in either browser as far as the margins go. I would look into preventing the form page from wrapping (as it did here in both browsers) on a select and its accompanying check mark. There are ways to make pages 'line up' identically in either browser. The best method is to use a strict doctype. There are also hacks that trick each browser into thinking that the margins and other values are different, resulting in them appearing the same, once each browser applies its unique method of interpretation on them. But, with this type of markup, none of this is required for a decent looking page (the true goal of design) in either browser.