![பயர்பாக்ஸ் logo](https://assets-prod.sumo.prod.webservices.mozgcp.net/media/uploads/products/2020-04-14-08-36-13-8dda6f.png)
Site appears broken in FF 64 bit
This simple web page (link below) has always before looked fine in FF and other browsers.
However, after the latest FF 64 bit update, it looks really broken. Note, it looks just fine in 32 bit FF. I am assuming this is a problem in the 64 bit version?
All Replies (4)
They have errors (77) in their CSS and 8 Errors, 7 warning(s) in there HTML. https://validator.w3.org/ https://jigsaw.w3.org/css-validator/
Stuff is allover the place when I look at it also. Suggest trying to contact the site to repair their code. I have no idea how to ignore their mistakes in Firefox. Some one else may later.
Sorry, but having never seen this site before, I don't know what is wrong with it on your Firefox. Could you share a screenshot? This article has tips on that: How do I create a screenshot of my problem? Please cut out or blur any sensitive information before attaching your image to a reply or posting it on an image sharing site.
Also, have you noticed Firefox objecting to any HTTPS connections as insecure?
Sorry, I just realized that I get a weird interaction when the Developer Tools (Page Inspector) are open. The layout is more often good than bad, but I can get the bad layout as well. ???
Okay, I think I have a better idea of what's going on. This page hasn't been updated for web standards. It declares it is using "transitional" HTML4 which dates back to... I don't even know how far back that was... but because the DOCTYPE is incomplete, Firefox actually uses an even more backwards compatible mode.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
In Firefox, this incompete DOCTYPE invokes something called "quirks mode" where many requirements are relaxed. Of most relevance here is this one:
In quirks mode CSSclass
andid
names are case insensitive. In standards mode they are case sensitive.
(https://developer.mozilla.org/docs/Mozilla/Mozilla_quirks_mode_behavior)
There are multiple mismatches in the page's use of id's and CSS selectors, the most critical being:
HTML id attribute: <div id="Content">
CSS rule for that id: #content {}
Note that one is capitalized and one is not.
Firefox 57 has a new CSS engine and perhaps its inconsistent treatment of Quirks Mode (different behaviors on different reloads with Developer Tools open) is a "bug" or perhaps it was intended that websites need to pull up their socks and get even quirky CSS right. ??
I saw someone refer to a standard for Quirks Mode, which is a funny idea. I do not see case-insensitivity in this document, so perhaps it is the new normal starting in Firefox 57: https://quirks.spec.whatwg.org/