I'm facing a puzzling issue that has me stumped. I'm working on a website and have a simple footer with a link at the bottom:
<div id="sitefooter">
<a href="#">This is the link</a>
</div>
My stylesheet includes styling for this footer along with other elements:
#sitefooter {
float: right; width: 235px; margin: 10px 0 20px 0; text-align: center; font-size: 0.85em;
}
Everything looks great on all browsers except Safari. The footer appears, but doesn't display the styles applied - it defaults to the main body text styles. I've tried changing names to avoid conflicts, but that didn't resolve the issue either. Interestingly, adding inline styles fixes the problem in Safari. Another odd observation is that when viewing from the root domain (www.rootdomain.com/website/index.php) with a relative stylesheet path, Safari displays the footer correctly.
I'm baffled by the conflicting behavior. Safari can read the stylesheet since everything else renders correctly on the page in Safari, and it works fine on other browsers. When I add inline styles, Safari behaves as expected.
If anyone has any suggestions or insights into what might be causing this strange behavior in Safari, I would greatly appreciate it!
Thank you all for your help!
Dave