Member Avatar for ggeoff

Hi

My website works OK in IE9, Safari, Opera and Chrome but Firefox objects to my Contacts page. The contact form position is wrong and the navigation does not work for the Contacts page. The other pages work ok. Both HTML and CSS validate okClick Here

Edited by ggeoff because: added Opera to list of browsers tested
  • 2 Contributors
  • 4 Replies
  • 197 Views
  • 3 Weeks Discussion Span
  • Latest Post Latest Post by ggeoff
Member Avatar for Taywin

From what I see on FF, your div element with ID 'content' has left value of -245px in the CSS. Where did it come from?

The table element id 'table1' has top as -500px also. As a result, your form table is hanging up there and cover the navigation link (which means you can't click on the navigation link). You could always force the z-index of navigation to be high value, so that it is always on top of any elements.

When you design something like this, try to apply your CSS in its own child node. If you create CSS with both global and local and apply across the whoel page, you may get unexpected results.

Edited by Taywin
Member Avatar for ggeoff

Hi Taywin. The site works perfectly in all the standard browsers Every element is placed correctly. The problem is firefox. Firefox:

  1. misplaces the Form
  2. disables the navigation links
  3. takes the footer and places it in or over the Form links in the form and the footer links still work.

I found that the id for the table is not styled in the external CSS form so I have removed it. But left the code commented out. The id "content" is also not styled in the external stylesheet If I remove the id it alters the layout of the page on the other browsers.

The site is over a year old and I must have checked Firefox when I originally uploaded it. So, there has been an upgrade to firefox that has screwed up my website, or soemhow I failed to test it. The fact remains that the site is ok in IE9, Chrome, Safari and Opera.

Member Avatar for ggeoff

Correction: the content ID is styled in the external sheet in #outerWrapper #contentWrapper #content.

The -245px is in that declaration block.

Member Avatar for ggeoff

I have found that I was using a single table and there was a rule to add location to a table cell via the CSS. Firefox didn't regard that as valid and so ignored it. I removed the table and the site now works fine.

Edited by ggeoff because: typo
Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.