CSS Techniques

CSS Techniques

Styling input placeholders with CSS / Webagility

We’ve explored the deep dungeons of CSS before and found that we can access almost anything you see in your browser and shape it to your liking. But placeholder text in forms, that can’t possibly be styled, right? Right! … wrooong! Let me show you how to use CSS to make your placeholders look pretty …

 
CSS Techniques

Challenge – Recreating the iTunes Library

It’s time for another UI challenge! In the first challenge, we recreated some interactions from the MacOS application, Clear. In this one, we are recreating the look of the old iTunes library gallery. The Challenge This is what the final product looks like – Start the Challenge | Live Demo with

Source: bitsofco.de

 

 
CSS Techniques / Tutorial

Fluid Width Video

IN A WORLD of responsive and fluid layouts on the web ONE MEDIA TYPE stands in the way of perfect harmony: video. There are lots of ways in which video can be displayed on your site.

Source: Fluid Width Video

 

 
CSS Techniques

Filter Functionality with CSS3

Using the general sibling combinator and the :checked pseudo-class, we can toggle states of other elements by checking a checkbox or a radio button. In this tutorial we will be exploring those CSS3 properties by creating a experimental portfolio filter that will toggle the states of items of a specific type.

Source: Filter Functionality with CSS3

 

 
CSS Frameworks / CSS Techniques

Modular front-end development with LESS

I am constantly looking for ways to make my work as a front-end developer easier and more efficient, but it is only recently that I have paid my good friend CSS any real attention. This article will explore the benefit of organizing your code efficiently while keeping it reusable and modular.

Source: Modular front-end development with …

 
CSS Techniques

CSS Click Events

An article about different experimental approaches of employing click events using CSS only. It summarizes and shows some clever hacks and smart tricks.

Source: CSS Click Events

 

 
CSS Techniques

CSS Overlay Techniques

There are several techniques for creating overlays: from using an absolutely positioned element to outlines and pseudo-elements. In this article we are going to explore each technique’s styles with their pros and cons.

Source: CSS Overlay Techniques