Topic Archives

CSS Layouts

Explore various layout types, including flexible, responsive, and grid-based layouts, learn about the latest CSS features, like Flexbox and Grid, and find the resources that will help improve your CSS layout skills.

View all CSS content

8 CSS & JavaScript Snippets for Creating Blog Layouts

8 CSS & JavaScript Snippets for Creating Blog Layouts

CSS / JavaScript / UI Design

A collection of stunning CSS and JavaScript code snippets for creating modern blog homepages and single posts layouts.

8 Code Snippets That Demonstrate the Power of CSS Grid

8 Code Snippets That Demonstrate the Power of CSS Grid

CSS / UI Design

As web designers continue to experiment with CSS Grid, we’re seeing many new and creative methods of solving common layout issues.

10 CSS & JavaScript Parallax Scrolling Effect Snippets

10 CSS & JavaScript Parallax Scrolling Effect Snippets

CSS / JavaScript / UI Design

A collection of CSS & JavaScript snippets for creating the parallax effect. Play around with code and use them in your own projects.

Beautiful Poster Art Created with CSS & JavaScript

Beautiful Poster Art Created with CSS & JavaScript

CSS / JavaScript / UI Design

Posters are among the most common art forms. You probably had a few of them on your wall as a child. They cover the full spectrum of people, places, and…

The 10 Most Popular Open Source Front-End Web UI Kits

The 10 Most Popular Open Source Front-End Web UI Kits

CSS / UI Design

You can save loads of development time by working with frontend UI kits. To help, we have curated the best open source UI frameworks available.

The Desktop Features You Should Consider Leaving Out on Mobile

The Desktop Features You Should Consider Leaving Out on Mobile

UX Design / Web Design

We take a look at some desktop features that you should leave out on mobile. Items that are likely to prevent users from getting the most out of your website.

Better Responsive Design With CSS clamp()

Better Responsive Design With CSS clamp()

CSS / Web Design

With so many mobile devices on the market, we’re flooded with viewport sizes. That makes it especially challenging to design a fully-responsive website. CSS media queries have long been the…

Don’t Let Legacy Software Stop You from Adopting the Latest Web Technologies

Don’t Let Legacy Software Stop You from Adopting the Latest Web Technologies

Web Design

We share some of the reasons why you may not need to hold back on implementing the web’s latest and greatest technologies in your projects.

How Modernizr Can Help You Implement CSS Fallbacks

How Modernizr Can Help You Implement CSS Fallbacks

CSS / JavaScript

For websites that still have a significant number of users with older browsers, we show you how to utilize the Modernizr feature detection library.

10 Code Snippets for Creating Masonry Grid Layouts

10 Code Snippets for Creating Masonry Grid Layouts

CSS / UI Design

We have ten free open source snippets for creating custom masonry grid layouts. Easy to copy, easy to edit, and perfect for all web designers and developers.

10 jQuery Plugins for Creating Dynamic Web Layouts

10 jQuery Plugins for Creating Dynamic Web Layouts

JavaScript

These jQuery plugins will help build responsive and dynamic layouts, masonry grids, parallax scrolling, or make webpage presentations.

Fun Examples of CSS Imitating Print Design

Fun Examples of CSS Imitating Print Design

CSS / JavaScript / UI Design

There’s still some value in having a document or other printed product that you can hold in your hand. And as much as the web has promised a “paperless” world,…

The Role Fluid Layouts Play in Modern Web Design

The Role Fluid Layouts Play in Modern Web Design

Web Design

Fluid design is ultra-adaptable, user-friendly, and cooperates across devices – a necessary design foundation for the modern web user. However, it’s surprising how many web designers don’t understand the role…

10 Handy CSS Grid Code Snippets

10 Handy CSS Grid Code Snippets

CSS

The CSS grid spec isn’t exactly “new” but it’s definitely newer in the mainstream dev world. Many frontend coders don’t even know about the CSS grid properties yet, let alone…

The Cutting-Edge CSS3 Features That Are Essential to Modern Web Design

The Cutting-Edge CSS3 Features That Are Essential to Modern Web Design

CSS

Over the last couple of years, CSS has evolved into more than web designers and developers could have ever expected. CSS3 introduced features such as border-radius, box-shadow, text-shadow, text-overflow, multiple-background,…

How to Rearrange Content When it’s Too Wide with jQuery

How to Rearrange Content When it’s Too Wide with jQuery

CSS / JavaScript

From its humble beginnings more than 25 years ago to the omnipresent behemoth it is today, the web has always been changing. Recently, the explosion in the popularity of mobiles…

Discussing the Pros & Cons of Using a CSS Framework

Discussing the Pros & Cons of Using a CSS Framework

CSS

A CSS framework is a piece of software that has a lot of options for you to use in your HTML development, potentially making it faster and easier for you…

Coding Flexible Web Layouts in HTML5 and CSS

Coding Flexible Web Layouts in HTML5 and CSS

CSS
12