うらひな　ブログ。

ヒナ@club_hinako『のほほん日記』 ━━ 日々のあれこれや気になるものたち ━━

テンプレートのミス発見2

2008-11-15 19:01:36 | WEBお勉強メモo
「うらひなブログ」のテンプレートデザインに、また不具合発見(´・ω・｀)あぅー

お友達の持っていたiPhoneでブラウジングした時に気づきました。


どうやらウインドウのサイズで落ちてしまうらしい。
デザイン的には、大外枠のdivのwidth（横幅）指定は930pxにしてあるのにどうして？(・ω・;)(;・ω・)

自宅のPCはウインドウサイズを常に大きめ（930px前後）にしているので、気づかなかったよ。
iPhoneみたいな小さなサイズで観て初めて気づいた．．．
　またブラウザチェックし切れて無いじゃんorz

ウインドウサイズを小さくして確認。
あにゃ？横スクロールバーでてるのにっ。。。
なんなのー(´；ω；`)

と思ったら、どうやら犯人はこの子。
検索Boxのカラム落ち

goo | ブログ | ランダム | ブログを作成 |【PR】...
どうやらこの【PR】君が長かったご様子。

そうか・・・
今回は「【PR】 実在する世界の珍地名はどれ？旅行券100万円分プレゼント 」だけど、
どんな長さが来るか、時々によって違うのね。φ(・ω・｀)...メモ

画面上部の黒系のグラデーションがかった背景画像をbodyの背景として指定していたから、
検索Boxが1行下がるとその分ヘッダーの画像とずれてしまっていた、
という訳。

HTML*
<body>
　　<div id="global-header">（gooのお知らせ・検索Boxエリア）</div>
　　<div id="container">（ここからスタート）
　　　<div id="title-banner">ヘッダー部分</div>
　　</div>
・・・
CSS*
body {
background: url(グラデーション画像のパス) repeat-x top left;
}
#container {
margin:0pt auto;
width:930px;
}



まさにこの高さ分ズレている。

失敗(´・ω・｀)ノ”ペチッ


しかも、CSSを有効にして画像を非表示にした場合、
ブログのタイトルが白文字指定なので背景色と同化して見えていなかったことにも気づくorz
　↑まったくもって有り得ない



足りないことだらけだ。
修正修正・・・(｀・ω・)ノ　



コメントを投稿

ブログ作成者から承認されるまでコメントは反映されません。