CSS

TwitterFacebook
Get flash to fully experience Pearltrees

Burst Title

http://css-tricks.com/oprah-burst-title-thing/ Published by Chris Coyier During the previews for a movie I saw recently, there was an advertisement for an Oprah-related something or another. I wasn't paying attention because I was trying to get out my phone so I could snap a picture of it. Which I failed to do.
Published by Chris Coyier Elements can have multiple class names. For instance: < div class = "module accordion expand" ></ div >

Multiple Attribute Values

http://css-tricks.com/multiple-attribute-values/

Adobe-like Arrow Headers

http://css-tricks.com/adobe-like-arrow-headers/ Published by Chris Coyier Adobe has some pretty cool header bars for modules on their site. The header bar is divided into left and right sections. The left being an explanatory title and the right being a related link.
Published by Chris Coyier Let's say you're browsing Google Web Fonts for a free font to use on your website. You find one you like... You think it will look nice as headings on your site. So you follow the directions on Google Web Fonts "quick use". 1) Copy/Paste CSS link to page:

Public Service Announcement: Watch Your @font-face font-weight

http://css-tricks.com/watch-your-font-weight/
http://www.useragentman.com/blog/2012/01/03/cross-browser-html5-progress-bars-in-depth/ Update (March 9, 2012): I have updated this document to include styling information for Internet Explorer 10. Screenshots of HTML5 progress bars with different styles applied. Details given below.

Cross Browser HTML5 Progress Bars In Depth

(Better) Tabs with Round Out Borders

http://css-tricks.com/better-tabs-with-round-out-borders/ Published by Chris Coyier The following is a guest post by Menno van Slooten . You might notice we've been down this road before , but I quite like Menno's approach here.

postcard from Paris – css3 keyframes animations in use | PeHaa Blog

http://pehaa.com/2011/08/postcard-from-paris-css3-keyframes-animations-in-use/ postcard from Paris – css3 keyframes animations in use I decided to explore the area of css3 keyframes animations. The idea was simple – to create a sort of virtual postcard. I live in Paris so obviously I send you my greetings from Paris :). Click here or on the image to view the animation demo.

Blur Menu with CSS3 Transitions

http://tympanus.net/codrops/2011/10/19/blur-menu-with-css3-transitions/ There are so many great things we can do with the additional properties and possibilities that CSS3 brings along. Today I want to show you how to experiment with text shadows and with transitions in order to achieve a blur effect that we'll apply to a menu on hovering over the elements. The main idea is to blur the other items while enhancing the one we are currently hovering. View demo Download source
http://webdesignerwall.com/tutorials/css3-image-styles

CSS3 Image Styles

When applying CSS3 inset box-shadow or border-radius directly to the image element, the browser doesn't render the CSS style perfectly. However, if the image is applied as background-image, you can add any style to it and have it rendered properly. Darcy Clarke and I put a quick tutorial together on how to use jQuery to make perfect rounded corner images dynamically. Today I'm going to revisit the topic and show you how much more you can do with the background-image CSS trick. I will show you how to use box-shadow, border-radius and transition to create various image styles. View Demo Image Styles