New CSS3 features
CSS is the key point for designing a website and through CSS you can create the light design of the website which helps to load the website faster on the internet and the top features of the CSS3 are like
1. Border radius which aids to create the rounded corner in the design.
2. The other feature is web font which allows users to attach any fonts on the web page which are like to the users.
3. Box shadow allows users to insert the shadow inner and outer side directly from the HTML elements.
4. CSS3 2D transforms allows users to move turn and stretch the elements.
Can you list overall things that CSS3 differ from CSS2 ?
Yawn. You left out media queries. Surely that is the most important single enhancement??? The rest are just eye candy. Anyway, what I would like to know is:
Originally Posted by Delois
1. Is CSS3 still stuffed full of vendor specific syntax?
2. Do the vendor specifics actually work the same or are they just similar?
3. How much of it (particularly media queries) works on smart phones (particularly Symbian) and smaller tablets?
4. Has the gaping omission in the CSS2 definition of media types been rectified in CSS3? I.e. Does CSS3 rigidly define the difference between the "handheld" and "screen" media types? Or is it still left up to each manufacturer to decide which their devices should respond as???
5. How much of it works just as well in CSS2 anyway? (I know that border radius does, I've not tried the others).
6. What about IE8? (That's just rhetorical, we know that IE8 does not understand any of it).
Questions 3, 4 and 5 are the key ones for me. It's all right crowing that CSS3 works (with minor variations) on the mainstream browsers, but smart phones are THE growth area. And if the media types "screen" and "handheld" are applied arbitrary by each manufacturer, what use are the media queries anyway??? Also, if it works in CSS2 why change??? Well at least until the vendor specifics are eliminated...
Does this answer a few of your questions?
Also have you ever dealt with media queries yet on a code basis?
Not really. Which browser(s) do the smart phones use?
Originally Posted by Dragonfire2008
I experimented with media types, not media queries. I.e. I set up different CSS files for media types "handheld" and "screen", and checked the results on a 320x240 Symbian phone and a 320x480 Android one. The Symbian phone responded to the handheld CSS file, the Android to the screen CSS file.
Originally Posted by Dragonfire2008
I am not completely sure if the stock browsers on smart phones can it, but i assume firefox, opera, and now chrome (just realized to android recently) can handle css3 because css3 was built for smart phones and tablets in the first place. A browser that doesn't support it yet IMO isnt out of beta.
Media Queries deal directly with screen sizes, kinda like this...
if screen resolution = 320 width -> phone.css
if screen resolution = 640 width -> tablet.css
if screen resolution > 640 width -> main.css
so it is totally dependent on screen size, BUT with some new smartphones supporting big screen resolutions, im talking like 720p, I'm not sure how to fix it.
My point is that if media type "screen" was defined properly media queries would be little needed. I suggest it should be < 640 px width = "handheld". 640+ px = "screen". Why 640? Because that was the original screen width of VGA (640x480). Also, that was the size that web sites were written for (before progressing to 800 then 1024 px). It was pretty well standard. No VGA screens were smaller than that. Hence there is a good historic precedent for "screen" = 640+ px.
Using fluid design techniques I can write web sites that adjust automatically from 800px (or so) down to 320px, without using media types or queries. However it does limit the size of graphics I can put on the page.
Users Browsing this Thread
There are currently 1 users browsing this thread. (0 members and 1 guests)