Category: CSS

Embedded Gists in a Flexbox Layout: Too Soon?

Published 2 years 1 month ago on May 1, 2016

I’ve been tidying up a bit around here and (for the most part) restructured the entire style layer of Monday By Noon to be both mobile-first and Flexbox based. I’m officially smitten with Flexbox and use it quite a bit now. I got caught up on an issue as I was updating existing content, specifically the code […]

CSS3 Buttons with Gradient Stroke

Published 4 years 1 month ago on April 25, 2014

I style a lot of buttons, but a classic treatment I find myself needing to implement is one with a gradient background and subtle gradient stroke along the edges. Over time my solutions began with multiple elements and specific CSS for each. It got the job done but it was clearly bloated. CSS3 changes so […]

Wicked Opinionated WordPress Plugin: Concatenate Assets

Published 5 years 4 days ago on June 10, 2013

An area that could have used some modification in my workflow is the optimization of third party assets when building WordPress sites. Those stylesheets and JavaScripts that make additional HTTP calls we’ve come to know and hate. There are a ton of existing solutions out there, but I wanted something a bit more… finicky and custom-tailored to my approach.

Using CSS3 Pseudo Elements and Box Shadows Instead of Images for HiDPI Geometric Shapes

Published 5 years 4 months ago on January 14, 2013

HiDPI in Web design is kind of a double-edged sword for a front end developer. We now have two nearly separate environments (in some cases) that need attention. That sometimes results in double the style rules, double the image assets, and feature detection. Addition of anything is often the opposite of what we try to do, so it’s important to be as smart as possible when approaching management of HiDPI assets and styles in our projects.

CSS px is an Angular Measurement

Published 6 years 3 months ago on March 13, 2012

CSS px is an Angular Measurement. I’m not quite sure exactly what to make of this but I found it interesting. The ‘px’ unit in CSS is a non-linear angular measurement… The moon from Earth is about 24.3px wide, for example. What it really comes down to is screen resolution. Discussions surrounding the pixel were […]

#328 Twitter Bootstrap Basics – RailsCasts

Published 6 years 3 months ago on March 12, 2012

#328 Twitter Bootstrap Basics – RailsCasts. If you’re not familiar with them, RailsCasts are really high quality screencasts focused on Ruby On Rails development. While I don’t do much (if any) RoR development consistently, I think this 10 minute screencast is a great look into why Twitter Bootstrap is so powerful. If you’re a RoR […]

Scope CSS classes with prefixes

Published 6 years 3 months ago on February 20, 2012

Scope CSS classes with prefixes · Deep Thoughts by Mark Otto. This is a short, sweet, and fantastic article on writing modern, lean, effective CSS. I’ve been thinking a lot about writing better CSS lately, and adopting a system like this has helped exponentially. Programmers are said to be lazy, front end developers should be […]

How Basecamp Next got to be so damn fast without using much client-side UI

Published 6 years 3 months ago on February 20, 2012

How Basecamp Next got to be so damn fast without using much client-side UI – (37signals). This is super neat. 37signals outlines a big look into what they did behind the scenes when building Basecamp Next, specifically the changes made on the client side. There is some wacky stuff going on but I’m super interested […]

Using CSS without HTML

Published 6 years 3 months ago on February 20, 2012

Using CSS without HTML · Mathias Bynens. While not at all for production use, this is a really neat look into the idea of building a document without any HTML. Now you see why this isn’t for production use by any means. The technique is based on some fallback behavior implemented by browsers, namely auto-inclusion […]

* { box-sizing: border-box } FTW

Published 6 years 3 months ago on February 19, 2012

* { box-sizing: border-box } FTW « Paul Irish. The universal selector got a bit of a bad reputation when people used it as a CSS reset. There are some performance concerns when using it, but Paul Irish makes a great suggestion here. border-box is a good thing, just as long as you can break […]

Copyright © 2006—2018 Jonathan Christopher