SASS also lets you define nested styles and again if you saw this earlier in the section on LESS, this will look familiar to you. So, you have probably seen the CSS code that looks like this before. You have a class that defines some styles and then you have the same class but uses some child … [Read more...]
Variables in SASS
May 11, 2013 By Leave a Comment
SASS variables are declared using a dollar sign character and are defined like CSS values and they can be one of six different types. numbers $myVar: .25in; strings $myStr: "some piece of text"; colors $ myColor:blue; booleans $myBool: false; nulls $myVar: null; lists $myList:1px … [Read more...]
Dealing with different custom post page and custom layout in homepage for post type
May 6, 2013 By Leave a Comment
Before i start explaining about custom layout for post type in index page, I assume that you know how to crate custom post page, if not then visit ghacks.net to know more about how to create custom post page and then how to modify it with your current post type in wordpress. Now there might be … [Read more...]
Introduction to SASS a CSS Preprocessor
May 1, 2013 By Leave a Comment
SASS just like LESS is a CSS preprocessor. It takes code that is written in certain syntax, in this case SASS syntax and converts it into official CSS before you upload it to your website. You can find more information about SASS by going to the sass-lang.com. SASS actually comes in two different … [Read more...]
First last and only structural selectors
April 18, 2013 By Leave a Comment
We are going to take a closer look at using our remaining structural pseudo-class selectors. First, last, and only type structural selectors allow you to introspect the children of a parent element and then target child elements based on their position, amount, and status within the parent … [Read more...]
Types of Nth Child selector syntax
April 17, 2013 By Leave a Comment
Let’s take a closer look at the syntax available for Nth child pseudo-class selectors. There are 4 Nth child selectors; Nth child, Nth last child, Nth of type, and Nth last of type. These are similar to the other structural selectors with one fairly important difference. They … [Read more...]
Structural selectors in CSS 3.0
April 17, 2013 By Leave a Comment
It is easy at first to overlook the new structural selectors in CSS3. At first glance, they look rather obscure and frankly they aren’t getting the amount of press that features such as gradients, transitions, and rounding corners are. However, I want to make a rather bold statement here. … [Read more...]
Target pseudo class selector
April 14, 2013 By Leave a Comment
 One of the more intriguing additions to CSS3 is the target pseudo-class selector. Much like the existing hover and focus pseudo-class selectors, target allows you to react to user interaction. In the case of target styling is applied if an element on the page is the target of the named anchor … [Read more...]
How to use Negation pseudo class selectors
April 6, 2013 By Leave a Comment
The negation pseudo-class selector is almost a class by itself. Unlike other selectors, the negative pseudo-class selector targets elements based on what they are not instead of what they are. Confused?? This is the selector that might take some time to wrap your head around. So let's take a look … [Read more...]
Pseudo class User Interface selectors
April 6, 2013 By Leave a Comment
CSS3 provides us with 3 pseduo-class user interface selectors that will come in very handy when styling interactive forms and applications. The enabled, disabled and checked pseudo-class selectors allow us to style elements based on their current state within the form or an application. As the … [Read more...]
Child and sibling selectors in CSS 3.0
April 3, 2013 By Leave a Comment
Mostly the attention directed towards CSS3 has showcased more flashy features like web fonts, animations, and gradient. As important as those features are I would argue that no feature in CSS3 is as important to designers then the CSS level 3 selectors module.Let us explore the selectors module and … [Read more...]
An overview of attribute selectors
April 1, 2013 By Leave a Comment
While attribute selectors are not brand new to CSS. In fact they have been around since CSS2.1. The release of CSS3 marks the addition of several new powerful attribute selector types that will make targeting elements based on attribute and attribute values even easier. Let's take a moment to … [Read more...]
Creating Radial Gradient in CSS 3.0
March 31, 2013 By Leave a Comment
Radial gradients can be tricky especially when trying to make the Webkit and Mozilla gradients match. Let's take a closer look at the syntax as we build our gradient. Of course before I do that let me give you an idea of what we are going to be doing. We are going to place a radial gradient sort of … [Read more...]
Overview of Gradient in CSS 3.0
March 31, 2013 By Leave a Comment
There is a lot of excitement surrounding CSS3 gradients and the ability they give us to draw gradients directly within the browser without using any background images or filters. While this excitement is well founded the current implementation and support of gradient varies widely from browser to … [Read more...]
Importance of pre-processor language such as LESS in CSS
March 29, 2013 By Leave a Comment
Since past couple of months I have been providing few important tutorials related to CSS 3.0, but today I would like to talk about some important CSS Preprocessor language such as LESS, SASS, Stylus, ZUSS which has been Hot Topic lately for Web Developers and Designers for practising best standard … [Read more...]
How to obtain transparency in CSS 3.0
March 27, 2013 By Leave a Comment
The level 3 color module provides 2 ways for dealing with transparency, the opacity property and by specifying an alpha value in RGBA or HSLA color declaration. So, before we start please download the necessary file here. Essentially, what we have is a photograph of a Coit tower and some … [Read more...]
CSS Color module level in CSS 3.0
March 25, 2013 By Leave a Comment
I want to give a brief overview of how color works in CSS and then take a more detailed look at the new color formats available to us in CSS3. How we apply color really hasn’t changed from CSS2 to CSS3. We can still define color as part of the foreground, background, and border properties of … [Read more...]
Multi column layout module in CSS 3.0
March 24, 2013 By Leave a Comment
In the past of we wanted to create multiple column text on our webpages we would have to use some fairly clunky work around. CSS3 contains the multicolumn layout module that makes it easy to create multiple columns and give you severe options for controlling the columns themselves. Currently, … [Read more...]
CSS 3.0 and usage of Web Fonts @font face
March 24, 2013 By Leave a Comment
It has long been the dream of the many web designers to use fonts on their websites other than the basic system fonts that we have been using since the early 90s. Although, it has been a long journey, we seem to have finally reached that point with CSS3 and use of web fonts. So, what are … [Read more...]
Working with Box sizing in CSS 3.0
March 23, 2013 By Leave a Comment
Anybody that remembers dealing with internet explorer 5 and a box model hack has no desire to go back to does days but those of you that weren’t around for that little party, essentially internet explorer 5 parsed element widths differently than the box model recommendation in CSS2. Instead of … [Read more...]
Recent Comments