I have been working on a CSS menu for a website and have made it work perfectly on Firefox, Chrome, and an old Safari version. However, I encountered a strange issue with the latest Safari version (6.0.2 on Lion). When the page is fully loaded and I hover over the menu, it doesn't function properly. But if I hover over the menu while the page is still loading, it works fine. This behavior puzzled me until I noticed a pattern. Even though I understand it now, it's still frustrating. The problem seems to be isolated to the newest Safari version, and I'm struggling to find a solution. I've tried disabling other CSS files that might be conflicting but to no avail. It may be related to using iWeb to generate the initial HTML and then manually editing the code to add the menu functionality and styling.
I am actively making changes to the code, so the page might change frequently. Here is the problematic page with my edits:
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<!-- Rest of the XML code -->
Here is the custom CSS I added:
<!-- Custom CSS code here -->
If you are using Safari 6 on Lion and experiencing the same issue as described above, please let me know. Also, I would appreciate any insights or suggestions on resolving this issue. Thanks!