You have probably seen the first part of this tutorial. Like I told you in the second part we will make that form look better using CSS3.
I know that many times we are in need to have a box or a side bar where we need multiple borders. And because the box could be rendered dynamically we just can’t afford to have a background and limit the width or height to be fixed.
What I’ll present in this tutorial multiple ways to build a box with borders with CSS. I did found several methods that we could use 8 by now.
Here is a demo page with the boxes.
In this demo I used width and height fixed so they can stay in the same line but that doesn’t mean that it can’t have dynamically width or height.
Recently I needed a PHP script to minify my CSS files. There are many tools out there but the process was complex.
So I did found a PHP function that compress the CSS files. The process is done using preg_replace PHP function.
In order to save your precious bandwidth, you should compress your css files. Doing so is not hard at all using this snippet.
As you already know from the launch of CSS2.1 they implemented the :before and :after pseudo-elements. I know not many people use it but I find it quite helpful.
What are they doing after all?
The :before selector inserts content before the selected element(s).
The :after selector inserts content after the selected element(s).
IE8 support both pseudo-elements
You can see 3 examples here.