css CHEAT SHEET

.dkirBox {  
    position: relative;  
    z-index: 3;  
    zoom: 1;
}  
.dkir {  
    display: block;  
    text-decoration: none;  
} 
.dkir span {  
    position: relative;  
    z-index: -1;
}  

ぶら下がりインデント

li span {
    text-indent: -1em;
    margin-left: 1em;
}

---

css ハック

---

二倍バグ

.box {
    display: inline;
}

高さ1pxを実現する

span {
    overflow: hidden;
}

ネガティブマージンを付ける

.box {
    margin-left: -10px;
    position: relative;
}

ドットボーダー

/* BORDER */
/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *

.border-dottedを使用する時は直下に.whiteBoxをおいてください。
Example）
<div class="border-dotted">
    <div class="whiteBox">
      <span>イーハトーヴ</span>
    </div>
</div>

* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */



div.border-dotted {
  padding: 1px;
  background: url("../imgs/border-dotted.gif") repeat 0 0;
}
div.border-dotted .whiteBox {
  background-color: #FFFFFF;
  padding: 15px 20px;
}

リストの隙間

中のaタグにzoom:1;

min-height

.foo {
min-height:100px;
height: auto !important;
height: 100px;
}

トランジション

-webkit-transition: background 0.3s ease;
-moz-transition: background 0.3s ease;
-o-transition: background 0.3s ease;
transition: background 0.3s ease;