How to kill mobile safari with CSS by Klaus M. Brantl

On wednesday we’ve relaunched deam.org. The content-block is encased with a nice, white glow-effect. Of yourse not for all you IE-users out there ;-)
We’ve used the two “box-shadow”-attributes. The “-moz-box-shadow” for Firefox and the “-webkit-box-shadow” for Safari (and them derivates).

Thats what we’ve used: -webkit-box-shadow: 0 0 200px #fff;
And that “killed” my mobile safari. It has been unresponsive for several seconds. And after one interaction again unresponsive… and so on.

After stopping and starting Safari it went blank. No more interaction. Only thing that worked: Reset the cache in the prefs.

I should add that it’s a 3G iPhone (no “S”).
There are definitly some memory-issues here :-)

Now we use “-webkit-box-shadow: 0 0 20px #fff;” – doesn’t look that “smooth”, but it’s ok.

Tags: CSS, html, mobile, Safari

This entry was posted on Friday, December 11th, 2009 at 08:17 and is filed under Software. You can follow any responses to this entry through the RSS 2.0 feed. Both comments and pings are currently closed.