Safari

[yoshida]

The Safari browser is at last available for Windows. This gives me more flexibility in creating websites that appear equal for both PC- and MAC users.My heart was filled with joy when I clicked the 'download' button, but with despair when I viewed my websites with Safari. Turns out it only renders css for standard text, not for links, <h1>, etc. (I'm using h1 structural, not 'just' for presentation).Is it bad? Yeah, pretty bad. I tend to have link classes to create my buttons: link color, style, background image/color, border color are all css. Everything seems to work fine, but... where's my text. Same things happen with all links, as soon as they are subject to css.In short: visit www.padvindersband.nl with Firefox/IE6 first, then with Opera, then with Safari. My CSS and XHTML are validated, and I'm currently reading "Designing with web standards" (2nd edition, Dutch) by Jeffrey Zeldman.Example:

.deflink a { margin-top: 4px; text-align: center; font-size: 11pt; display: block; height:20px; color: #222299; text-decoration:none; }.deflink a:link { background-image:url('img/default/menu/back1.gif'); background-repeat: no-repeat; }.deflink a:visited { background-image:url('img/default/menu/back1.gif'); background-repeat: no-repeat; }.deflink a:hover { background-image:url('img/default/menu/back2.gif'); background-repeat: no-repeat; color: #cc7700; }

This is the minimum amount of css for a menu button.Here's how it's applied:

<div class="deflink"><a href="?pageid=nieuws">Nieuws</a></div>

(by the way, would <a href="somelink.html" class=deflink>I'm a link</a> be better? No time to test that right now.)Are more people experiencing the same issue, or have I done something incredibly wrong? Is this going to be fixed for Safari's final release? (currently being beta and all) Does Safari prey on weak css? (bad pun ^^)

[boen_robot]

It could be an issue with your computer not being compatable with Safari (or more likely - vise versa), not with Safari's rendering engine itself. Here's a screenshot from your page in Safari:It looks fine to me. However, the menu seems to go behind the rest of the content in IE7. Here's a screenshot:

[yoshida]

The IE7 issue is a known issue, and on the list for 'avoid/resolve during next projects'.I'm using the new Safari beta (3.0.1) running with Vista.More importantly, I created a test page using the same CSS and menu buttons, and found that declaring font-weight: 600; for a link causes the issue (even for links in a different class). ANY other font weight is ok, but font-weight:600 causes Safari to choke and don't display the link at all.Link issue: solved. However, Safari doesn't seem to support <h1>, <h2>, <h3>, <b>, <i> etc. eventho <h1> is perfectly valid structural markup.I mean, what is everyone supposed to do, write XHTML1.0 strict all of a sudden? I'm big with standards, but Safari is taking it to ridiculous levels. (perhaps if I'd define markup tags in my css... tasty!)

[boen_robot]

Could you create a page that only demonstrates this issue and give a link to it. I really can't see what's wrong and I'd like to know AND see, so that I could avoid it.

[yoshida]

Sure, here it is. Don't mind the Dutch language, it's not important for the issue itself. Just to demonstrate what Safari seems to be incapable of.Just found another problem: my mouse (LT MX510) has thumb buttons to click back and forth. They don't work with Safari as well.

[boen_robot]

I still can't see any difference. Here's a shot from Safari:and here's a shot from IE7:could you please tell me what's the difference, or better yet, give a shot from your PC, so that I could observe, cause I really don't see any difference.

[yoshida]

Images are blocked where I work (will make shots when I get home).Do you use the béta for Safari on Windows Vista? I use the Dutch safari on an US English copy of Vista Business. (a freebee from Microsoft, because I'm learning system management in the evening hours)Do the buttons contain text? Below the buttons, do you see a link? Do you see bold and italic text? Do you see a main title <h1>? If yes, then my specific opy of Safari is flawed, and only for my websites...

[boen_robot]

As I said, everything on the page is OK.And of course I have Safari on Windows. That's how I took the screenshot.However, I have Windows XP SP2. I haven't tryed Safari on Vista yet, but I do have a Vista PC, so I will. The issue could still be "Vista only", but it's a third OS after all.

[yoshida]

This is how it looks for me:Needless to say, this concerns me. Either I scuk at webdesign (standardconform at least) or 95% of the outdated pages will scuk with some copies of safari, depending on configuration.Ah well... first versions of 'appleware for PC' tend to scuk. Photoshop, iTunes, quicktime... all quirkier than their Apple equivalent on first release and perhaps still. (not as quirky as my websites but as long as it works with the most popular browsers, who's to blame.)

[smartalco]

from what i have heard around the internet, safari on Vista has lots of rendering problems, on XP it seems ok, and the 3.0 beta on OSX is just fine, I can't imagine apple released it for Vista know it had all these problems...

[yoshida]

Yeah well... it makes OSX look good ^^ (everything about Vista makes OSX look good, to some peepz

[croatiankid]

Have you guys forgotten it's a beta?

[yoshida]

Have you guys forgotten it's a beta?

No, of course not. But do 0.9 versions of your websites look that way?

[boen_robot]

Have you guys forgotten it's a beta?

Well, I haven't. Still, Apple should've made some testing and still, this should be reported to them as a Vista only issue (or yoshida's computer issue... I still haven't got a hand of that other computer).

[aspnetguy]

keep using browsrcamp.com ofr Safari testing until Windows Safari is more stable. With it still in beta you can't know for sure whether it is an issue with your code or a Sarari bug.