広告デカ杉
前回記事でインフォシーク iswebライトマンセー！ヽ(´ー｀)ノ とやったにもかかわらず、急に広告がデカくなって萎え萎え。
あの下品なマスゴミのニュースヘッダが下部広告になっただけマシな事を除けば、デカ杉で長所なし。
2ペインのブラウザで800x600（SVGA）のディスプレイで閲覧すると横幅が大幅に足りないって、オイ。
まぁ、今どき800ｘ600はないって事かwww
怒りに任せて、このサイトで使っているSerene Bachのデザインテンプレートをイジくりまくってやった。
ついでに、いつの間にかサービスが終了していたHarbotのタグ（過去記事参照）も外した。
代わりにアクセサリーパーツ、ハーボットクロックを用意されてもねぇ、可愛いけど (〃▽〃)
無料とはいえ、インターネット上のサービスはどいつもこいつもわがままだ。
<body>
<div id="wrapper">
<div id="header">ヘッダー</div>
<br clear="right" />
<div id="navigation">サイドバー</div>
<div id="container">
<div id="contents">記事1、記事2、…</div>
</div>
<br clear="right" />
<div id="footer">フッター</div>
</div>
</body>
body {
text-align: center;
background: #fff url(/template/bg.png) repeat fixed;
min-width: 810px;
}
div#wrapper {
text-align: left;
background: #fff;
margin: 0 30px;
padding: 0 30px;
}
div#wrapper div {
text-align: left;
}
div#header {
height: 170px;
background: url(/template/sb_header_bg.png) no-repeat right;
margin-bottom: 30px;
}
div#navigation {
font-size: 12px;
line-height: 1.5;
width: 200px;
float: right;
margin-left: 30px;
overflow: hidden;
}
div#container {
font-size: 14px;
line-height: 1.75;
overflow: hidden;
}
div#contents {
width: 98%;
}
div#footer {
width: 690px;
height: 20px;
background: url(/template/sb_footer_bg.gif) no-repeat;
margin: 30px 0 0 auto;
overflow: hidden;
}つまり、Fluid Width（いわゆるリキッド）レイアウトにしつつ最小の横幅を810pxにして、自ら800x600ディスプレイに引導を渡してやった。
さてこれからどうしよう、800x600な我がオンボロノートPC君… ヽ(τωヽ)ノ
Comments