CSS Basics

CSS Positioning Basics (Screencast)

By / / 19 Comments

CSS PositioningA couple of years ago I wrote an article for a company called Thinkful on CSS positioning, which also included a screencast that I hosted on my ImpressiveWebs YouTube channel. The video was “unlisted” but I’ve now made it public, and since some time has passed I thought I would post the video here.

It’s pretty basic stuff for most experienced CSS developers, but if anyone wants a quick primer on CSS positioning, this should be a good guide. The video is embedded below and I’ve summarized the content here in this post.

Clearing Floats: Why is it Necessary Even in “Modern” Browsers?

By / / 26 Comments

Clearing Floats: Why is it Necessary Even in The other day, someone asked me the following question: “If I understand it right clear float is automatic in most modern browsers right?”

If you’re new to CSS, then it would seem that the answer to this question should be “yes, of course — modern browsers don’t have these types of bugs!” But the necessity to clear floats is not a browser bug; it’s actually, well, more of a CSS feature. And it’s still needed in so-called “modern” browsers (assuming you’re using floats for layout).

Web Development for Beginners (Resources)

By / / 44 Comments

Web Development for Beginners (Resources)While I usually try to write stuff that’s geared more to experienced developers, I don’t want to neglect those who are just starting out.

I’ve been collecting links to beginners resources for web development for some time now, so I thought I’d share that list here. Feel free to add your own in the comments.

Setting Up Sass on Windows

By / / 56 Comments

Setting Up Sass on WindowsThere’s a ton of information floating around on preprocessors nowadays. Most of that info is geared towards Mac users, so in this post I’m providing a very simple guide to help Windows-based developers get up and running quickly with Sass (my preprocessor of choice).

Overall, Sass is not difficult at all to get set up, even if you’re doing it on the command-line. But if you have no interest in going through all these steps, but still want to use Sass on Windows, well, just skip to the final heading in this post for a reference to an app that lets you start using Sass on Windows with minimal setup.

Using Min/Max Width and Height in CSS

By / / 9 Comments

Even if you’re just getting started with CSS, you’ve likely used the height and width properties quite a bit already.

But you’ve probably noticed that those properties can put unnecessary constraints on your page elements. So you might benefit from knowing and using related properties that use the “min” and “max” prefixes.

CSS Selectors Defined

By / / 12 Comments

If you’re just getting started with CSS, it’s good to have a fundamental understanding of what we mean when we refer to CSS selectors. In this post I’ll briefly describe all the most well-known CSS selectors along with some examples.

What’s the Difference Between Classes and IDs in CSS?

By / / 22 Comments

When applying CSS styles to an element in your HTML, you’ll be using different CSS selectors to target your elements.

Two of the most common selectors used in CSS are the “class” selector and the “ID” selector. There are many others, but this post will focus on these two, and I’ll describe the difference so you’ll know the potential effects of using either of these selectors.

The Difference Between “Block” and “Inline”

By / / 35 Comments

For the purpose of CSS styling, elements can be generally divided into a few different categories. Two of those categories are block-level elements and inline elements.

In my opinion, this is one of those areas that, once understood correctly, can help beginners to take their CSS skills to the next level.

Older Articles ⭢