Movabletypeスタイルシートハック

昨日、一旦リセットしたこのBlogのテンプレートに
前付いていた機能を再実装している。

MTはCSSを非常に巧みに使っており、スマートに処理している。
コメント部分に使うCSSはカスタムが必要だった。

 .module-content-neo {
 position: relative;
 margin: 10px 5px 5px 5px;
 }

module-contentをコピーし、名前を変更”module-content-neo”とした。
で、このまま見るとCSS要素が足りない。
Findしてみると・・・かなり下の方にあったのでコレもコピーする。

 .module-content-neo {
 margin: 0 0 10px 0;
 border-top: 1px solid #cfd4d9;
 padding: 10px 10px 0 20px;
 font-size: 10px;
 line-height: 1.2;
 }

上記2点ともカスタム後。
枠内のオブジェクト位置はpaddingで指定する。各パラメータの指定要素は
「上、右、下、左」である。この場合「上10px、右10px、下0px、左20px」となっている。

参考…CSS概説
この作業はmiにコピーして行うと非常に楽だ。要素を色分けしてくれるのでスペルミスも気づきやすい。

カテゴリー: 未分類 パーマリンク 拍手する

コメントを残す

メールアドレスが公開されることはありません。 が付いている欄は必須項目です