スポンサードリンク

CSSでコンテンツを格納するブロック要素の幅にautoを指定してはいけない

当ブログではソースコードの表示に SyntaxHighlighter を使っているのですが、どういうわけかコンテナに使っている textarea が画面の幅を超えて伸びてしまってたんです。

それだけならまだ良いのですが、全体の幅まで広がってしまうのでテキストがめちゃくちゃ読みにくくなってしまってたんです。

いやいや、これはマズイでしょ。

というわけでいろいろ調べた結果、どうやら全体のコンテンツを格納するブロック要素(今回は divタグでした)の幅の指定を auto(width:auto;)にしてたのがダメだったようです。

それにしても、何で auto なんて指定をしてたんだろう? と思ったら、どうやらレスポンシブデザインにする時によく分かってなくて、「自動調整してくれるならOKじゃん」とか思ったみたいです。

これは失敗でした。

そんなわけで改善の方法なのですが、単純に幅の指定を 100%(width:100%;)にすることで解決しました。

うん。よしよし。

スポンサードリンク
コメント
Verify your Comment
Previewing your Comment

This is only a preview. Your comment has not yet been posted.

Working...
Your comment could not be posted. Error type:
Your comment has been posted. Post another comment

The letters and numbers you entered did not match the image. Please try again.

As a final step before posting your comment, enter the letters and numbers you see in the image below. This prevents automated programs from posting comments.

Having trouble reading this image? View an alternate.

Working...

コメントを投稿

プロフィール


  • 書いてる人:夢界 陸

    名古屋在住のおっさん。
    プログラミングやガジェットの話など、 日々の興味を徒然と綴っています。



    Twitterやってます @mukairiku



    運営サイト
    www.mukairiku.net

アクセスランキング


ブログ内検索

Licenses

  • Creative Commons License

OTHER

  • このブログのはてなブックマーク数

    ブログパーツ
Blog powered by TypePad

スポンサードリンク