徒然雑記
つらつらつれづれ
calender
recent entry
profile
2010
05
24
Mon.
05
24
Mon.
ブログのテンプレート変えてみた話
昨日の夜くらいからテンプレート変えました。
CSS3で実装して未対応のブラウザでもあんまり影響なさそうな中で角丸が使いたかったので使いまくってみました。
ちょっとした角丸とかドロップシャドウとかグラデーションとか画像なしでできるのはとってもありがたいですね。
角丸のためだけにdivタグ増やしたりbackground要素入れたりって地味に面倒なんですよね。
色違いもいちいち画像作んないといけないしね。
あー、なんかいろいろ思い出してきた。
めんどうくさかった思い出が走馬灯のように駆け巡る。
ただ、ブロック要素の使い方によってはやっぱりそのためだけにタグいくつか追加しなといけないので、画像作っちゃったほうがHTMLソースはきれいな場合もありますね。
どっちを取るかは場合によりけりだろうとは思いますが、しかしいろいろ試したくなる……!楽しいなちきしょう……!!!
とかなんとか言っても、動作確認は実は適当なので共有テンプレート申請とか出せないのであります。
Firefox3.5以上とかSafari4とかではちゃんと見えてるんじゃないかと思いますが、IEは8でもがっちり四角でChromeは角丸指定入れちゃうと四隅全部が角丸になっちゃうみたいでとっても間抜けなことになってました。
ついでに右のプラグイン部分がズルしようとして失敗しているのが丸見えになっていました。きゃっ!
はい、そこ。おもしろがってわざわざChromeで見たりしないように。
というわけで、このブログは基本的にFirefoxかSafariの割と新しめのバージョンを全力で推奨するのであります。
今回の件での言い訳じゃないからね!
元々個人的にはそういう方針なんだからね!
CSS3で実装して未対応のブラウザでもあんまり影響なさそうな中で角丸が使いたかったので使いまくってみました。
ちょっとした角丸とかドロップシャドウとかグラデーションとか画像なしでできるのはとってもありがたいですね。
角丸のためだけにdivタグ増やしたりbackground要素入れたりって地味に面倒なんですよね。
色違いもいちいち画像作んないといけないしね。
あー、なんかいろいろ思い出してきた。
めんどうくさかった思い出が走馬灯のように駆け巡る。
ただ、ブロック要素の使い方によってはやっぱりそのためだけにタグいくつか追加しなといけないので、画像作っちゃったほうがHTMLソースはきれいな場合もありますね。
どっちを取るかは場合によりけりだろうとは思いますが、しかしいろいろ試したくなる……!楽しいなちきしょう……!!!
とかなんとか言っても、動作確認は実は適当なので共有テンプレート申請とか出せないのであります。
Firefox3.5以上とかSafari4とかではちゃんと見えてるんじゃないかと思いますが、IEは8でもがっちり四角でChromeは角丸指定入れちゃうと四隅全部が角丸になっちゃうみたいでとっても間抜けなことになってました。
ついでに右のプラグイン部分がズルしようとして失敗しているのが丸見えになっていました。きゃっ!
はい、そこ。おもしろがってわざわざChromeで見たりしないように。
というわけで、このブログは基本的にFirefoxかSafariの割と新しめのバージョンを全力で推奨するのであります。
今回の件での言い訳じゃないからね!
元々個人的にはそういう方針なんだからね!
2010
05
23
Sun.
05
23
Sun.
【CSSメモ】margin:auto;を使わないでセンター配置する方法
CSSでブロック要素をセンター配置するとき、
margin:0 auto;
ではない方法を見つけたので、ちょっと自分メモ。
その上にもう一つブロック要素置いてtext-align:center;にするのはあまり好きじゃないので、個人的にはもっぱらmargin:auto;をよく使うのですが。
.selector {
width: 800px;
position: relative;
float: left;
left: 50%;
margin-left: -400px;
}
左寄せ→画面の真ん中に左端を持ってくる→ブロック要素の半分の幅だけ左に寄せる
ということらしい。IE5.5対策かな。多分。
使う機会はあまりなさそうだけど。
……とか書いてたら、なんか前にもこの書き方見たことある気もしないでもないけど、まぁ、忘れてたわけだからいいや。メモメモ。
しかし、CSS3のリファレンスなんかが載ってるサイトでIE5.5対策って必要なのかしら。
と思わないこともない。
margin:0 auto;
ではない方法を見つけたので、ちょっと自分メモ。
その上にもう一つブロック要素置いてtext-align:center;にするのはあまり好きじゃないので、個人的にはもっぱらmargin:auto;をよく使うのですが。
.selector {
width: 800px;
position: relative;
float: left;
left: 50%;
margin-left: -400px;
}
左寄せ→画面の真ん中に左端を持ってくる→ブロック要素の半分の幅だけ左に寄せる
ということらしい。IE5.5対策かな。多分。
使う機会はあまりなさそうだけど。
……とか書いてたら、なんか前にもこの書き方見たことある気もしないでもないけど、まぁ、忘れてたわけだからいいや。メモメモ。
しかし、CSS3のリファレンスなんかが載ってるサイトでIE5.5対策って必要なのかしら。
と思わないこともない。