kawasako

<h1>test</h1>

kawasako

// clearfix
@mixin clearfix {
  zoom: 1;
  &:after {
    content: "";
    display: block;
    clear: both;
  }
}

kawasako

// Example ul>li*3

// Bad
ul {
  li{
    margin-top: 10px;
    border-top: 1px solid #ccc;
    &:first-child {
      margin-top: 0;
      border-top: none;

kawasako

// Example .ball>.ie

@-webkit-keyframes pop {
  0% {
    top: 0;
  }
  10% {
    top: -30px;
  }
  30% {

kawasako

// Example

@mixin hoge {
  p {
    color: red;
    @content;
  }
}

.alert {

kawasako

require 'webrick'
include WEBrick
s = HTTPServer.new(
  :Port => 8000,
  :DocumentRoot => '.'
)
trap("INT"){ s.shutdown }
s.start

kawasako

// Example

.hoge:active{
  color: red;
}

.fuga {
  @extend .hoge:active;
}

kawasako

// Mixin

@mixin inline-block() {
  display: inline-block;
  *zoom: 1; // hasLayout true for ie7
  *display: inline; // for ie7
}

kawasako

// Example

$colors: red, blue, green;

@each $color in $colors {
  .#{$color} {
    color: $color;
  }
}

kawasako

// Example

@mixin hoge($num, $str){

  // if $num
  @if $num < 10 {
    margin-top: $num;
  }@else{
    margin-top: 15px;
  }