新ブログバナー

--.--.--スポンサーサイト

上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。

2011.05.09HTMLの未解決事件

迷宮入りなんてさせない!
いや、個人的に悩んでいるだけなんですけどね。

会社ではHPの作業をよくするんですが、去年あたりから
解決できない問題があるんです。
とりあえず同じ状態のものを、我が部隊HPの中で再現しました。

↓↓
プリントテストページ

ブラウザ上では、中身のない普通のページなんですが、
印刷プレビューで複数ページになると、レイアウトが崩れて表示されてしまう状態になります。
(firefoxでは、また違ったズレ)

印刷プレビューのズレ
(クリックで拡大)

大きく分けて以下の三つ。
①左メニューのbackground-colorが適応されない
②footer(フッター)が2ページ目の頭にくる
③background-repeat(背景画像の繰り返し)が反映されない

①はinclude(インクルード)を使用しているからかもしれませんが、
背景の色を白に設定しても、おおもとのカラーが出てしまいます。

②一番下に来なくてはいけないfooterが、2ページ目の上にきます。
スタイルシートの記述順によっては、フッターが上に被さったり、
下に潜り込んだりと自由気ままです。

③まっするHPでは繰り返し画像は使用していませんが、会社のHPでは
横に細長い画像をrepeat-y(縦に繰り返し表示)させています。
しかし、このプレビュー及び印刷をすると、一番最初の画像が
表示されるだけで、繰り返しが起こりません。

これらを正しく表示&印刷できないかと模索している所存です。
いろいろと検索してみると、「print.css」を使えという紹介がありますが、
出来ればcssで指定して、そのままのものを印刷できる状態にしたいのです。

実は②のフッターが頭にくる問題は自力で解決しています。

#ritte {
clear:both;
width:800px;
height:auto;
padding:5px 0;
margin-top:10px;
border-top:1px solid #7FFFD4;
font-size:12px;
letter-spacing:2px;
text-align:center;
}

上がフッターの記述(未熟なので無駄なものがあるかもしれません)なんですが、
これに overflow:hidden; を加えただけで、正しく一番下に落ちてきました。

という事で、残るは①と③の問題です。
これをなんとかcss内で解決出来ればと思いますが、なかなか・・・。
ただ、自力で直せれば、ステップアップした勘違い気分が味わえそうです。
グヘヘ。

5/10 一応この問題は解決済です。(翌日の日記参照)
Secret

TrackBackURL
→http://hasenritte.blog85.fc2.com/tb.php/660-4d54294c
上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。