Safari   (& formerly Chrome)

This Web browser has a serious rendering defect.

(Note:   This page may be obsolete - we can't confirm until we find someone with a Mac - Safari for Windows was discontinued for lack of interest in 2015)

Safari has problems with handling [br style="clear:left"] just before a [/p] (or even at the end of a text region not within a [p] container). This probem has been reported since at least 2010, but there is apparently no interest in fixing in the WebKit rendering engine.

Chrome (now 66% of browser usage (Statcounter July 2020)) had the exact same problem, but Google forked development of the WebKit engine due to uncorrected problems, and imediately corrected this one - leaving only Safari (17% of browser usage (Statcounter July 2020)) with this defect. Interestingly, the ratio for Clovegarden visitors is significantly different, more like: 50% Chrome, 26% Safari, 18% Mozilla & Firefox (July 2020), which indicates a high Mobil Devices ratio.

The defect causes millions of Web pages to display poorly, with image paragraphs skewed to the right of each other rather one below the other. This happens on pages that pass W3C Verification perfectly (clovegarden.com is now fully html5 and css3 verified, and indexed by the Google Mobile First spider). We have made some adjustments to aleviate the worst problem, but all further suggested fixes cause unacceptably erratic spacing.

Many pages in the ingredients section of Clovegarden use [br style="clear:left"] to make our content readable. Some will render correctly in Safari, at some times - or not - depending on settings and screen resolution.

Work Arounds Quick fixes #1 and #2 work most of the time, but in some cases nothing helps except #3. #1:   Click on the "Full Screen / Window" button. You will get a properly rendered full screen page. Click it again and you'll get a properly rendered page in a window. #2:   Move the left or right margin of your page display in or out (just one pixel is enough). The rendering will be corrected. #3:   Use a Web browser that renders correctly. Firefox, Internet Explorer, Opera, and now Chrome do not have this defect.