Carrie (carriep63) wrote in s2expressive,

  • Mood:

As promised... CSS visual guide to Expressive.

In this tutorial, I am going to break down much of the CSS used in the Expressive style. I have not included every single class in the following breakdown, but instead focused on the "common" and most easily explained classes. (If you want a quick visual, it's in this tutorial at a glance.)

The Expressive style has a lot of markup! You will find that almost every div has an "outer" and an "inner". By adding margins, padding, and borders to the "inner" divs, you can usually avoid the border box model headaches. This makes everything generally cross-browser compatible and everyone is happy. (More on margins and padding vs. the border box model here.)

I am hosting this tutorial on my website rather than on Livejournal this time. I hope to have all of my tutorials in one place eventually...

  • This tutorial is for all account types
  • I have used the "two column, sidebar on left" with no theme for this.
  • Custom reply pages are not available on basic accounts
  • This breakdown is not yet complete, I will add pages as I go!
  • Comments and general questions welcome, but I'm not available to help you with your layout here, sorry.
(1) General Page Layout | (2) Alpha classes | (3) Beta classes
Tags: !beginners guide, contribution, css:guide
  • Post a new comment


    Anonymous comments are disabled in this journal

    default userpic

    Your reply will be screened