Interesting info on Safari specific CSS, much doesn't work, something crashes

1 view
Skip to first unread message

Christopher Allen

unread,
Jul 2, 2007, 1:15:22 AM7/2/07
to iPhoneWebDev
There is a blog post "Make the most of the iPhone SDK" at
http://dev.lipidity.com/apple/iphone-webkit-css-3 on the topic of
Safari specific CSS. Make sure that you view the page while using
Safari ;-)

Unfortunately, much of the CSS that does work in Safari 3.0 doesn't
work on the iPhone. In fact, something, which I've not identified yet,
will hard crash iSafari.

Some comments on the post that I added as a comment to his page:

Overall: Wide single columns are very difficult to read on the iPhone.
WordPress blogs are specifically guilty at this. I recommend a
slightly narrower column if you are going to want people to read this
on the iPhone

Section 1: The third text-input doesn't look any different then the
2nd on the iPhone -- no X like in Safari 3.0. The "go to top" button
was shaded, but didn't have a rounded rect around it like Safari 3.0.
The second button wasn't square like the Safari 3.0 one was.

Section 2: There appears to be no way to drag items on the iPhone like
you can in Safari.

Section 3: You could add text to the text box in Safari, but when you
tapped on the box on the iPhone the keyboard does not slide open thus
you can't enter any text.

Section 4: You do not appear to be able to select text in either text
box. I don't think selection is supported on the iPhone.

Section 5: All your rounded corners examples looked the same in both browsers.

Section 6: Text shadow worked, but box shadow did not. Text stroke did not.

Section 7/8: As others have noted, something in your file in either
section 7 or 8 when rendered blows the iPhone's safari away, crashing
you back to the apps menu.

Section 9 and 10: I don't know, I can't view that far!

-- Christopher Allen

Reply all
Reply to author
Forward
0 new messages