- » Kindle
- » iBooks
- » kobo
- » B.W.
- 200円
- » Kindle
- » iBooks
- » kobo
- » B.W.
- 400円
- » Kindle
- » iBooks
- » kobo
- » B.W.
- 200円
- » Kindle
- » iBooks
- » kobo
- » B.W.
- 600円
- » Kindle
- » iBooks
- » kobo
- » B.W.
- 200円
- » Kindle
- » iBooks
- » kobo
- » B.W.
- 200円
- » Kindle
- » iBooks
- » kobo
- » B.W.
- 100円
doncha.net制作・発行:KindleやiBooks、楽天kobo、BOOK☆WALKERで読む電子書籍
IE8で表示がバグってた
読書SNSの本棚のタブメニューがIE8で表示バグ。いや、気づいてたんだけど、IEなんてもうイラね、と放置。
タブメニューが4つほどあって、その各々でやることが違う=コンテンツ量が違うので、コンテンツ部分のdiv要素の高さが違う。
これをjavascriptで display:block noneを切り替えるわけだが。
FireFox、Safari、IE7は意図どおり、コンテンツ部分の高さに合わせて、親要素の高さを広げてくれるんだけど、IE8はコンテンツ部分の高さを広げてくれない。ケイ囲み(親要素)からべろ~んとコンテンツがはみ出してみっともないったらありゃしない。floatした子要素の高さを親要素に伝えるためのハックをスタイルシートには適用してあるんだけど、なんでやねん、と。ごそごそスタイルシートをいじったりHTMLに直接styleを埋め込んでみても、ちっともいうことを聞きやがらず、すっかり放置だった。
朝から団地の掃除、イトーヨカドーの特売、と地域密着活動の合間を縫って、見直してみた。結果。
javascriptで切り替えるときに、親要素もいじれば意図どおりになった。
id.style.display='none'
id..parentNode.style.display='none'
id..parentNode.style.display='block'
id.style.display='block'
IE8はけっこうまともという話なので、本来こうすべきところ、なのかな。
ちなみに、
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />
こんなのヘッダに入れると強制的にIE7互換表示モードにしてくれるんだけど、このIE7互換がいい加減っぽくて、本当のIE7と表示が違ってたりするんで困ったちゃんでした。
» ローカル環境で電子書籍を作る、Macアプリ・Windows版ツール 「かんたんEPUB3作成easy_epub」