両脇に門松を立てたい

謹賀新年

---

　今日もスタイルシートの話。
　現在、私のブログの右側でパンダが跳ねていると思うが、本当は左右両側で跳ねさせたい。パンダが両脇で跳ねたら五月蝿いかもしれないが、例えば正月にはこのエントリーの上のように両脇に門松を立てたい。片側ではバランスが悪い。
　このエントリーの上の門松は次のようにしてウィンドウ幅が変わっても両脇に来るようにしてある。

<TABLE BORDER=0 WIDTH=100% CELLSPACING=0 CELLPADDING=0 align=center>
<TR>
<TD ALIGN="left">
<A HREF="http://www.so-net.ne.jp/upp/resource/sozaisyu/clip/ev_newyear2003.html" TARGET="_blank">
<IMG id="kadomatu" SRC="/_images/blog/_e63/self/5988617.gif" ALT="門松" style="width:60px; height:113px;">
</A>
</TD>
<TD style="text-align:center;">
<SPAN style="font-size:400%; line-height:100%;">謹賀新年</SPAN>
</TD>
<TD ALIGN="right">
<A HREF="http://www.so-net.ne.jp/upp/resource/sozaisyu/clip/ev_newyear2003.html" TARGET="_blank">
<IMG id="kadomatu" SRC="/_images/blog/_e63/self/5988617.gif" ALT="門松" style="width:60px; height:113px;">
</A>
</TD>
</TR>
</TABLE>

　私のブログの右側でパンダを跳ねさせているスタイルシートは次の通り。

<style TYPE="text/css">
body { background:#666666 url("/_images/blog/self/175519.gif") no-repeat fixed right center; }
</style>

　「no-repeat」を「repeat-x」にして横方向に並べれば、両脇に背景画像が表れることがある。しかし、ちょうど良い位置に来るとは限らない。ブログのサイズを固定すれば両脇に門松が来るような横長の画像を用意して背景画像にすれば良い。しかし、やはりウィンドウサイズを変えてブログの横幅が変わることを前提にしたい。
　良い方法はないだろうか？
　できれば、背景画像をクリックするとジャンプするようなリンクも設置したい。その方法も分からずにいる。

　ところで、昨日指定したウィンドウ幅を変えても横スクロールバーが出ないスタイルシート（参考）であるが、その後にWindowsのIEで確認したら、ある程度狭めるとmain要素がside-a要素の下に移ってしまった。まだ問題がありそうである。正月は暇なので少し考えてみたい。

追記：
　WindowsのIEでウィンドウ幅が狭くなるとmain要素がside-a要素の右下に移ってしまう原因が分かってきた。スペースのない長い英文を改行できないことが問題のようである。例えばＵＲＬはMacOS9.2.2のIE5.1.7では「/」の所で改行してくれる。さらに狭くすると枠をはみだして表示してくれる。しかしWindowsのIEではそのような配慮はないようである。それで英文の幅よりもmain要素の幅が狭くなるとmain要素がside-a要素の右下に移ってしまうらしい。さらに強引に狭くするとウィンドウに横スクロールバーが登場する。飽くまでも表示領域の幅を狭めたくないようである。
　引用タグの部分は「blockquote { width:80%; overflow:auto; }」で対応しようと思ったのだが、WindowsのIEでは問題ないが、MacOS9.2.2のIEでは引用文が全て消えてしまったので使えない。悩んでいる最中である。ウィンドウ幅を変えて閲覧できるようにするスタイルの指定は諦めるしかないのだろうか？