This Web browser has a serious rendering defect.
It has problems with handling [br clear="left"] or [br style="clear:left"] just before a [/p] (or even at the end of a text region not within a [p] container) have been reported since at least 2010, but there is apparently no interest in fixing the problem with the WebKit rendering engine.
Chrome (now 51.2% of browser usage (Statcounter Feb 2015)) had the exact same problem, but Google forked development of the WebKit engine and imediately corrected this problem - leaving only Safari (13.7% of browser usage (Statcounter Feb 2015)) with this defect. Interestingly, the ratio for Clovegarden visitors is significantly different: 41.1% Chrome, 28.0% Safari, 16.4% Mozilla & Firefox, 13.1% Internet Explorer (April 2015).
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. 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 clear="left"] or [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.
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.
More Information: Google Issue 41749