" Live as if you were to die tomorrow. Learn as if you were to live forever.. "
- Mahatma Gandhi

Creating CSS Gradient

Posted on November 23rd, 2015 by Tushar Mishra

Gradients are smooth transitions between two or more specified colors. The CSS gradient feature was introduced by Webkit about two years back, but was not very successful as most popular browers didn’t support the feature. But now that is set to change with the arrival of CSS3 which supports gradients, specifically, linear and radial gradients. […]

Can Css3 Transition replace jQuery animation?

Posted on November 23rd, 2015 by Subodh Mishra

CSS3 Transition is one of the coolest feature that can help achieve some of the effects of animation using CSS only. It is one of the specs of W3C working drafts but it is not supported in IE 8 and 9 beta.The browsers which support this property are Google chrome 7+,Opera 10+,Mozilla firefox 4.0 beta,webkit […]

How to Include CSS 3 styles for Internet Explorer 6 to 9

Posted on November 23rd, 2015 by Mohit Bhayana

This Tip is related to the Inclusion of CSS3 properties for Internet Explorer 6 to 9, CSS3 properties are not supported by Internet Explorer 8 and below versions, This tip will alow to add these properties in the all IE browsers. Go to this website and download the package. (www.css3pie.com) Here is a small example […]

Mixing Percentages With Absolute Units In CSS

Posted on November 23rd, 2015 by Sourabha Sahoo

It will be great if we can mix the percentage units with absolute units in CSS layout to specify sizes of elements. For example to specify 50% width plus an additional width of 10 or 20px. We can do it by using calc() property. Example: #calc{ width: calc(100% – 100px); width: -webkit-calc(100% – 100px); width: […]

Show truncated string with dots appended with CSS3

Posted on November 23rd, 2015 by Dipak Panda

Showing starting few words of a long text by not using client side or server side coding with three dots ahead Have you ever thought of showing starting few words of a long text by not using client side or server side coding with three dots ahead? Like: a quick brown fox jumps… You may […]

Making A Sliding Banner Using HTML And CSS3

Posted on November 23rd, 2015 by Snehanjali Sahoo

Let’s say we need three banners to slide down one by one. First we need to create the banner container, containing the three banners. <div class=”bannerContainer”> <div class=”firstBanner animationDetails”> <span class=”biggerText”>Header</span><br/> <span class=”smallerText”>Body</span> </div> <div class=”secondBanner animationDetails”> <span class=”biggerText”>Header</span><br/> <span class=”smallerText”>Body</span> </div> <div class=”thirdBanner animationDetails”> <span class=”biggerText”>Header</span><br/> <span class=”smallerText”>Body</span> </div> </div> Now lets add some […]

Client side form validation using CSS3 pseudo-classes

Posted on November 23rd, 2015 by Chinmoy Dey

Form validation is a common thing in web applications. First we concentrate on server side validations, next to increase user interactivity of application, we go for client side validations using javascript, jQuery, etc. Now HTML5 and CSS3 are gradually evolving. HTML5 offers new input types and attributes that makes validation much more easier using CSS3 […]