Students
Students get a Tuts+ subscription for just $45! Hurry limited offer.
Advertisement

CSS

  • Sass
    Understanding Variable Scope in SassScope
    264 shares
    In this article, we’ll take a deeper look at variables and variable scope in Sass. The scope of a variable describes the context within which it’s defined and therefore where it’s available to use.Read More…
  • Animation
    Adding Appeal to Your Animations on the WebButton
    275 shares
    How to add appeal to your designs by combining multiple animations, delays and timing functions.Read More…
  • Community Projects
    CodePen Challenge #1: Results!Codepen challenge 1
    46 shares
    Last week we asked you to take part in our first CodePen Challenge (oh, there will be more)–here’s what you all cooked up!Read More…
  • Preprocessors
    How to Use Myth: “CSS the Way it Was Imagined”Myth
    106 shares
    In this tutorial, I'm going to walk you through a tool named Myth. Myth is an alternative CSS preprocessor which, unlike Sass or LESS, doesn’t use proprietary syntax. Instead, Myth adopts “future” syntax as specified in the CSS Working Draft.Read More…
  • Community Projects
    CodePen Challenge #1: Style Section Links with CSSCodepen challenge 1
    98 shares
    What better way to run a web design Community Project than on CodePen? In this, the first of such challenges, I want you to check out our example pen, fork it and improve it. That’s all you have to do. The best examples will be showcased next week!Read More…
  • CSS
    CSS Feature Detection: Modernizr or Feature Queries?Supports
    316 shares
    In this tutorial, I’ll go over two approaches for detecting whether a browser supports certain CSS features or not. The first one takes advantage of Modernizr, a popular JavaScript library and the second one feature queries, a promising CSS solution.Read More…
  • Responsive Web Design
    Quick Tip: Try Combining EMs and REMsBlocks
    107 shares
    At the 2014 CSSConf in Australia, Simurai gave a really amazing presentation called "Styling with Strings" where he goes over quite a few techniques for developing in-browser. The one tip that really stood out to me was this: pad UI components with EMs, put space between them with REMs. Or, as a rule of thumb: EMs for padding, REMs for margin.Read More…
  • Responsive Web Design
    How to Make Responsive, Scrollable Panels with FlexboxFlex
    462 shares
    If you’ve been keeping up with the work ZURB has been doing with Foundation for Apps you may have noticed most of their demo templates have some pretty nifty scrollable panels. That’s what we’ll be learning how to build today.Read More…
  • CSS
    Let’s Make Some Dynamic, Animated Section LinksLink
    125 shares
    In this tutorial, we'll discuss a technique for dynamically generating section links with JavaScript, and then animating them using CSS. Let’s dive in!Read More…
  • CSS
    CSS Level 4 Selectors to Watch Out ForFour
    1117 shares
    The CSS Selectors Level 4 draft from the 15th of January outlines a major jump in features for CSS. Let’s examine some of them!Read More…
  • Responsive Web Design
    New Course: Responsive Web Design RevisitedResponsiverevisited
    75 shares
    In our new course you’ll get up to speed with the very latest in Responsive Web Design. First you’ll learn what “responsive” really means today, and how a new “content first” approach lets you cater for all types of users from the ground up. Then you’ll create a complete responsive design using all the latest techniques.Read More…
  • Sass
    An Introduction to Sass Maps: Usage and ExamplesMaps
    348 shares
    For scalable front-ends Sass Maps are a blessing. Extracting configuration from the logic of a module is a great method for structuring. Let me explain to you why I think Sass Maps are the best feature in Sass 3.3.Read More…
Advertisement
Advertisement