CSS (Cascading Style Sheets) is a style sheet language that illustrates presentation semantics and is commonly used to provide a design framework for web pages written in HTML and XHTML.
Monday, July 19th, 2010
Category: CSS
Everyone’s chomping at the bit to leverage new HTML5 and CSS3 features but with some older browsers not supporting them, hacks are still needed to make things work in a cross-browser fashion. We’ve seen libs that make things easier such as Remy Sharp’s html5shiv and Modernizr and now we can add another one. Jason Johnston’s Read the rest…
Wednesday, June 30th, 2010
Category: CSS, JavaScript
, jQuery
Franz Enzenhofer has created a nice new webkitTransform plugin that helps you manage transforms and state. Franz tells us more: With jQuery.css you can’t easily change the webkitTransform CSS because webkitTransform is not your average CSS. If in one step you add .css(‘-webkit-transform’, “rotate(20deg)”) and in the next step .css(‘-webkit-transform’, “scale(2.0)”) the rotate value gets Read the rest…
Tuesday, June 29th, 2010
Category: CSS
The awesome Guillermo Rauch and Nathan White have taken one of the Web code katas and played with it. Before the Web we had [wW]indows. Maybe that is why developers are keen to implement windows within the Web page, mainly to see if it can be done. We had the great Emil and Erik building Read the rest…
Monday, June 28th, 2010
Category: CSS
Do you enjoy the “looks at me build something cool in pure CSS”-meme? It is kinda fun. On the one hand is shows what amazing things people can build, and on the other…. it reminds us that we need some tools to help make life easier. At least the platform is here, and tools can Read the rest…
Tuesday, June 22nd, 2010
The Chrome and HTML DevRel team at Google have released a new portal, HTML5 Rocks, that packages together some of the great resources available on HTML5 and the renaissance of browsers. Whether it be references on what you can do, to readiness to shims to get use features now. Beyond the resources, there is the Read the rest…
Sunday, June 20th, 2010
Category: CSS, JavaScript
Dmitry Fadeyev has a great writeup of less.js, the implementation of the LESS styling language in JavaScript itself. Traditionally you would write a less file such as: < View plain text > css @brand-color: #3879BD; .rounded(@radius: 3px) { -webkit-border-radius: @radius; -moz-border-radius: @radius; border-radius: @radius; } #header { Read the rest…
Monday, June 14th, 2010
< View plain text > javascript // Makes all paragraph elements grow a border and then atrophy away. $("p").animateWithCSS( {border: "5px solid #555"}, // CSS properties to animate 1000, // Duration in ms "cubic-bezier", // The timing function Read the rest…
Category: CSS
Developers continue to do crazy things to show us what can be done with CSS3. The latest is a fully animated Twitter fail whale by Steve Dennis: The idea for this came to me this morning after being greeted first thing this morning by another Twitter outage. I’d been looking for something to stretch my Read the rest…
Thursday, June 10th, 2010
Finally. Don’t make me jump to JavaScript to tweak the CSS when I want a relative calculation for a value. The effervescent Paul Rouget shows us the CSS calc() goodness that has a bug going for Mozilla. Some good simple use cases: < View plain text > css /* * Two divs aligned, split up Read the rest…
Wednesday, June 9th, 2010
Jack Prosser has fun proof of concept CSS magnifying glass. He told us a little about it: The main concept works on using CSS3 for the radius, making a round circle view point. This contains an iframe which is the exact same content. Using CSS3 again I scale the content in the iframe so that Read the rest…
Thursday, June 3rd, 2010
Category: CSS
Kevin Decker has upgraded his border-image generator tool. The major update is the ability to not have to host an image, but also use local ones. The tool itself is useful, but the post is very interesting as we get to listen in to the implementation process of Kevin as he got the feature working Read the rest…
Monday, May 31st, 2010
Category: CSS
Gordon Brander has a fun demo implementing the “Stacks” dock concept from Leopard using CSS3 only, including the following: :target pseudo-class transform transition border-radius border-image CSS gradients rgba colors text-overflow: ellipsis Check out the source to see it at work, with code such as: < View plain text > css .stack:target > ul { Read the rest…
Friday, May 21st, 2010
Browsers weren’t given guidance in early HTML specs for default styles on elements. Does the body have a margin or a padding? What colors? etc. The easiest way to deal with multiple browser is so reset the CSS for them all, and built up from there. We then got Eric Meyer’s reset and YUI reset Read the rest…
Wednesday, May 19th, 2010
While preparing my HTML WORKSHOP, I’ve been re-reading W3C specs in far further detail than I ever would’ve imagined. The reading experience is far from delightful. Not only is the text the entire browser width in measure, but it’s dense and laborious to read. No wonder browser vendors have traditionally missed subtle details. The paragraph Read the rest…
Tuesday, May 18th, 2010
Alex Girón, of CSS Beauty, has been playing with CSS3 goodness. His current experiment recreates our solar system spinning around using border-radius, transforms, and animations. The experiment runs beeeautifully on WebKit Nightly, but for some reason it lags on Chrome. Alex gives us the deatils: border-radius < View plain text > css ul.solarsystem li.sun { Read the rest…
Friday, May 14th, 2010
Category: CSS
CSS3 has a lot of great stuff in it. Transforms, new layout, media query, CSS object model, you name it. How do you keep up with the specs? That is what Šime Vidas thought, so he whipped together a little iframe love:
In Episode 25, we chat about IE 8, standards, Acid3, server side JavaScript, and more.
