CSS Tutorials

Create smart website navigation with css

I have written a tutorial in the past on how to create a smart navigation with jQuery, fontAwesome and CSS. Now I am going to show you how you can achieve the same result with just CSS selectors and fontAwesome. CSS3 has powerful selectors that infinitely expands the possibility of what developers can achieve with […]

chib | June 6, 2016 | → Continue

Create slanted navigation tabs

There are so many ways to create slanted navigation tabs, most of which involves the use of CSS :before and :after selectors which will in turn increase the size of your code. Let me show you how you can create slanted navigation tabs with fewer lines of code. Let’s get started. Go to jsFiddle.net Create […]

chib | November 3, 2015 | → Continue

Style form elements with Font Awesome icons

Website owners often settle for the default ugly look of HTML forms. A visually descriptive and interactive conversion form can contribute immensely to your website’s ability to generate business leads. In this tutorial, I will teach you how to style form elements with Font Awesome Icons. We’ll not be going into HTML form interactivity at […]

chib | May 19, 2015 | → Continue

Resize images with CSS

Designers always face the need to resize images and also avoid deterioration, whilst maintaining the images’s quality at the same time. There are so many ways to achieve this but I’d say that CSS is the simplest of all. Let’s learn how to resize images with CSS. Wrap the image in a container as shown […]

chib | December 11, 2014 | → Continue

Create a paper stack with CSS

If asked, you’d swear that the “paper-stack-like” content area of this website was achieved with one big image or bits of images. Thanks to CSS, that effect was not achieved with an image at all. In this tutorial we’re going to learn how to create a paper stack with CSS transform and before/after pseudo elements. […]

chib | July 7, 2014 | → Continue

How to override inline CSS

Inline styles could be so annoying when you’re not the one that put them there and the result isn’t exactly what you want. Fortunately, CSS is so powerful that it provides you with a super technique that can help you override inline CSS.

chib | December 23, 2012 | → Continue