{"id":606,"date":"2012-03-13T10:00:12","date_gmt":"2012-03-13T16:00:12","guid":{"rendered":"http:\/\/www.techory.com\/blog\/?p=1510"},"modified":"2012-03-15T12:58:07","modified_gmt":"2012-03-15T18:58:07","slug":"lie-to-me-css3-demystified-by-haakon-wium-lie","status":"publish","type":"post","link":"http:\/\/techory.com\/sxsw\/?p=606","title":{"rendered":"Lie to Me: CSS3 Demystified by Haakon Wium Lie"},"content":{"rendered":"<p><strong>Tuesday, March 13 &#8211; 11:00AM -12:00PM<br \/><\/strong><span class=\"pres_name\">H\u00e5kon Wium Lie<\/span> <span class=\"pres_title\">CTO<\/span> <span class=\"pres_company\">Opera Software<\/span><\/p>\n<p><strong>CSS Timeline<\/strong><\/p>\n<ul>\n<li>1994 &#8211; Cascading HTML style sheets<\/li>\n<li>1996 CSS1<\/li>\n<li>1998 CSS2<\/li>\n<li>2012 CSS3 Where is it??<\/li>\n<\/ul>\n<p>HTML has a simple structure, universal semantics, media-independent. It doesn&#8217;t have any presentation until the image tag arrived. Somehow the image tag took away the true text. The answer to this was CSS. <\/p>\n<p><strong>CSS3<\/strong><\/p>\n<ul>\n<li>border-radius<\/li>\n<li>box-shadow<\/li>\n<\/ul>\n<p>Example: The menu on Apple.com is currently done with images &#8211; it could be done fully in CSS3. The problem is (and probably the reason Apple has not done it with CSS3) older browsers do not support this.<\/p>\n<ul>\n<li>@font-face (this has existed since CSS2)<\/li>\n<\/ul>\n<p><strong>CSS3 Transitions<\/strong><\/p>\n<ul>\n<li>transition: 1s; transform: rotate(-360deg);<\/li>\n<\/ul>\n<p><strong>Testing<\/strong><\/p>\n<ul>\n<li>The acid 2 test was created to test browser compatibility with CSS. This put pressure on Microsoft to handle CSS correctly. In IE8, they finally did it.<\/li>\n<\/ul>\n<p><strong>Paging the Web<\/strong><\/p>\n<ul>\n<li><a href=\"http:\/\/people.opera.com\/howcome\/2011\/reader\/\">Opera Reader<\/a> takes a long web page and gets rid of the scroll. It cuts it up into pages.<\/li>\n<li>overflow: paged; is the tag that the Opera Reader recognizes.<\/li>\n<\/ul>\n<p><a href=\"http:\/\/people.opera.com\/howcome\/\">Slides and Code Available<\/a><\/p><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Tuesday, March 13 &#8211; 11:00AM -12:00PMH\u00e5kon Wium Lie CTO Opera Software CSS Timeline 1994 &#8211; Cascading HTML style sheets 1996 CSS1 1998 CSS2 2012 CSS3 Where is it?? HTML has a simple structure, universal semantics, media-independent. It doesn&#8217;t have any presentation until the image tag arrived. Somehow the image tag took away the true text. [&#8230;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":[],"categories":[31],"tags":[],"_links":{"self":[{"href":"http:\/\/techory.com\/sxsw\/index.php?rest_route=\/wp\/v2\/posts\/606"}],"collection":[{"href":"http:\/\/techory.com\/sxsw\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"http:\/\/techory.com\/sxsw\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"http:\/\/techory.com\/sxsw\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"http:\/\/techory.com\/sxsw\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=606"}],"version-history":[{"count":1,"href":"http:\/\/techory.com\/sxsw\/index.php?rest_route=\/wp\/v2\/posts\/606\/revisions"}],"predecessor-version":[{"id":618,"href":"http:\/\/techory.com\/sxsw\/index.php?rest_route=\/wp\/v2\/posts\/606\/revisions\/618"}],"wp:attachment":[{"href":"http:\/\/techory.com\/sxsw\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=606"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"http:\/\/techory.com\/sxsw\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=606"},{"taxonomy":"post_tag","embeddable":true,"href":"http:\/\/techory.com\/sxsw\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=606"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}