When you have and element within another padded element, both with different backgrounds and both with border-radius, make sure the inside element’s border-radius is a bit less than the outer element.
Chances are if you want to number things in order on a website, the ordered list (<ol></ol>) is your guy. It also is pretty reasonable that you want to style those numbers. Strangely enough, styling those list numbers isn’t a very easy thing to in CSS. Thankfully it’s also not impossible.
Hey ya’ll. This is (really) Chris Coyier. I had css-tricks.com registered on GoDaddy. It recently came to my attention that the ownership of this domain has been transferred away from my ownership to PlanetDomain. For now, thankfully the nameservers still point to MediaTemple, so the site is still up. That could change at any time.
I’m going to keep track of all this.
The list attribute / datalist element of HTML5 forms is pretty cool. As you type in a text input, it shows you a dropdown menu of choices you can pick from. Or you can type in whatever you want. The list attribute alone doesn’t lock you into any specific value. In that way, it’s a bit like a group of radio buttons with an “other” type-in option.
I got a great question from reader Josh Kreis:
I’ve noticed that on a <script></script> tag, there are all kinds of variations that all seem to work cross-browser. What is necessary and what isn’t?
In which I take a real example of somewhere I knew using sprites would be a good idea, create the sprite by hand in Photoshop (my preferred method), and then use SpriteCow to help with the exact position values needed to use the individual images. Pseudo elements are also used to help maintain accessibility.
Links from the video:
Project from Kyle Neath that builds a very human-readable "living styleguide" automatically from your CSS comments.
They are now in Firefox Aurora (pre-Beta). Also see video.
The official statement is to "Provide an alternative for most developers but leave Firebug power-users on Firebug."
Reading between the lines a little, they know there is a decent chance Firebug will start heading downhill. So they've made the decision to bring developer tools in-house and not rely entirely on that third-party.
24 ways, the annual all-thing-front-end-web advent calendar, kicks off this year with some very clever CSS trickery by the publications founder Drew McLellan.
