文字拡大時にレイアウトが崩れる

質問

普段何も気にせずに制作していたら○のように
文字を拡大してもレイアウトが崩れなかったのですが
新しくホームページを作っている時×のようなレイアウトになってしまいました。
下のfooter部分に食い込んできます。

2つのホームページを見比べても解決しません。
何が悪いのか見当も付きません。

似たような回答は他にもあったのですが解決できませんでした。
ご教授いただけますでしょうか

回答No.3

hijiki_who · ベストアンサー

No2です。解決できたようでよかったですね^^
heightはケースにもよりますが、基本的に可変の可能性のあるdivなどには指定しないほうが良いと思います。
ユーザーが文字を大きくしたときに崩れたり、のちのち文言を変更しようとした場合にCSSをその都度いじらなくてはならなかったり…と、ユーザーにも作成者にも不便になりますしね。
heightを指定していたのは、もしかして左右のボックスの高さを揃えたかったとかでしょうか？（もしそうならheightLine.jsなどを使用するといいかも！）
頑張ってください！

お礼

再度ありがとうございます。

heightLine.jsを勉強してみようと思います。

非常に勉強になりました。
ありがとうございました。

回答No.2

hijiki_who

ソース（HTMLとCSS）を書いていただけると、原因解明しやすいと思いますよ。

No1さんのおっしゃるとおり、position:absoluteになっているのでは、と思います。
ちなみに、footerの上の二つのボックスにfloatをかけていますよね？footerにclear:bothなどは設定されていますか？

お礼

ご回答ありがとうございます。

上の2つのブロックにheightを指定していて
それを削除するとできました。

heightは使ったらだめなのでしょうか？

回答No.1

fujillin

情報がないので、まったくの想像ですが…

フッターの部分を固定表示（position:absoluteでbottom指定）していたりしませんか？
そのままフッターを押し下げたいのであれば、この指定を解除してあげればよいかと。

想像ですので、違っていたら無視してください。

お礼

ご回答ありがとうございます。

上の2つのブロックにheightを指定していて
それを削除するとできました。

heightは使ったらだめなのでしょうか？