z63 zerosixthree

Open navigation
  • zerosixthree
  • Home
  • Snippets
  • About
  • @seb_ekstrom
  • Detecting media queries with Javascript

    January 26, 2015 25 comments

    With CSS pseudo elements and Javascript we can detect when a media query triggers. A more future proof and clean way to detect media query breakpoints.

  • Create your own personal boilerplate

    May 18, 2014 19 comments

    When starting on a new project it’s important to begin with a good solid foundation that you’re comfortable with. You can start working so much faster when you have a ready to use enviroment with a good file/folder structure and Grunt-tasks to go. This is why I like having my own personal boilerplate that I use for almost all projects I work on.

  • Quick tip: The minimal-ui meta tag

    March 13, 2014 8 comments

    With the release of iOS 7.1, Apple added a new viewport meta tag to Safari. The minimal-ui meta tag lets us minimize the top and bottom bar in the browser interface which gives us more screen real estate and creates a much more cleaner look.

  • Interview with Bryan Jones, creator of CodeKit

    March 10, 2014 3 comments

    If you’ve ever worked with Sass or Less, chances are you’ve used CodeKit. An application that helps you speed up your workflow with automatic file compilation, browser-auto-refresh and built in syntax control among many other features. After having worked as a freelance web developer, Bryan Jones decided to purse a career in business administration in North […]

  • Create a responsive header video with graceful degradation

    March 3, 2014 77 comments

    Create a responsive video header that works even in IE8 and is mobile friendly. Using jQuery, Modernizr and HTML5 data-attributes.

  • 8 Sass mixins you must have in your toolbox

    January 15, 2014 79 comments

    At their core, Sass mixins are blocks of code that you define once and can then re-use anywhere, if you are familiar with any programming language you can think of them as functions. In this post I’ll go over the 8 Sass mixins I think every developer should have in their toolbox.

  • Vertical align anything with just 3 lines of CSS

    January 13, 2014 391 comments

    With just three lines of CSS (excluding vendor prefixes) we can with the help of transform: translateY center whatever we want, even if we don’t know its height.

  • Create a CSS grid using calc()

    November 11, 2013 5 comments

    Calc() is a native CSS function that allows you to use mathematical expressions with addition, subtraction, multiplication and division. In this post I’ll show you how you can use this to create a basic grid.

  • Dynamically change text color based on its background with Sass

    October 17, 2013 5 comments

    Recently I found out a way to with jQuery dynamically change the background of an element with depending on the colors behind it. And I thought it would be neat to do the same but with text color and with SASS. This can be really useful if you are using an OOCSS/modular approach on your project.

  • How to create a one element Pong game in CSS

    August 19, 2013 No comments

    This article is not so much about how to create Pong, but how you can take advantage of browser implementation of HTML and usage of pseudo selectors.

  • 6 things I look forward to in CSS level 4

    August 4, 2013 3 comments

    The specifications for Media Queries and Selectors have recently been updated with some new goodie goodness. These specifications are only in the Editor’s Draft stage, which means they haven’t been officially published yet (more on that can be found here). But they give a hint on what may come with CSS level 4.

  • The standardisation of CSS

    July 23, 2013 One comment

    How does a new CSS property get standardised? Who makes the decisions? Why should I care about the standardisation process? What’s the deal with airline food? I’ll be covering that, and some more in this post.

  • Getting started with Grunt

    July 2, 2013 11 comments

    Grunt is a way to automate many of the tasks you’re doing when you develop. Are you still minifying, compiling, concatenating, compressing, prefixing all your code manually? Nonsense poopy pants! In this tutorial I will show you how Grunt will do all this for you, and then some!

  • 4 steps to improve your website’s performance

    June 12, 2013 2 comments

    So you got your fancy responsive site up. It looks great on your iPad, iPhone, Galaxy Note, Xperia Go, refrigerator and Tamagotchi. But have you given a thought on it’s mobile performance? In this post I’ll go over 4 simple steps to make your site more mobile friendly.

I don't care about attribution, mate. — Use everything you find here under Creative Commons CC0.

Find me on Twitter at @seb_ekstrom or by mail.