CSS has properties to make any element you wish behave as if it was a table element. You’ll need to structure them essentially as you would a table, and it will be subject to the same source-order-dependency as a table, but you can do it. I’m not crapping on it either, it’s genuinely useful sometimes.… Continue reading Making Semantic Elements Behave Like a Table
Just to play around, I wanted to achieve the following input box look with pure CSS 3. Also to teach myself how box-shadow works. I think I got pretty close. jsFiddle example
To add arrows for any boxes in CSS3 is relatively easy. You may use the border, absolute position along with the :before pseudo selector to add arrows in any directions. To make a triangle with CSS border: More on CSS3 shapes To position the arrow, make sure the box container is positioned relative so the… Continue reading CSS3 – add arrows to boxes
I use the TinyNav jQuery plugin to transfer a list menu into a dropdown for mobile devices. I notice when I resize my browser on my desktop, the TinyNav leaves kind of a nasty look. For example, after I resized my browser into mobile size like 450px wide, I have to refresh the page for… Continue reading TinyNav – browser resize friendly
I spent some time to understand how border-image works in CSS3. It does take a bit of visualization to wrap your head around it. On top of that, they really look different in different browsers depend on the browsers’ rendering engine. This is the best tutorial I found on this topic. I came up with… Continue reading Playing with CSS3 border-image
So one of the things I put into my new theme Tender Spring is the post thumbnail support. The theme handles the image that you set as post Featured Image on the post in a special way. It puts a circle around it and adds a leave. I’m sure it’s not a new concept but… Continue reading Tender Spring post thumbnail techique
