エントリーの編集
エントリーの編集は全ユーザーに共通の機能です。
必ずガイドラインを一読の上ご利用ください。
親要素を無視してブラウザ幅100%で表示するCSS - 動かざることバグの如し
記事へのコメント0件
- 注目コメント
- 新着コメント
このエントリーにコメントしてみましょう。
注目コメント算出アルゴリズムの一部にLINEヤフー株式会社の「建設的コメント順位付けモデルAPI」を使用しています
- バナー広告なし
- ミュート機能あり
- ダークモード搭載
関連記事
親要素を無視してブラウザ幅100%で表示するCSS - 動かざることバグの如し
CSSでは基本的にコンテンツを.containerとか.mainのdivで囲む。 大抵そのdiv要素はwidth768pxとかなんだ... CSSでは基本的にコンテンツを.containerとか.mainのdivで囲む。 大抵そのdiv要素はwidth768pxとかなんだけど、一部だけその要素を突き抜けてブラウザ幅いっぱいに表示したくなるときがある。 その時の回避法がいくつかあるんだけど、一番スマートで汎用的なのがあったのでメモ デモを見せろ こういうの See the Pen YaKLxW by thr3a (@thr3a) on CodePen. コード 親要素が.container、幅いっぱいに表示させたい要素を.full-widthとする。とHTMLは以下 <div class="container"> ほげほげほげほげほげほげほげほげほげほげほげほげほげほげほげほげほげほげほげ <div class="full-width"> ぴよぴよぴよぴよぴよぴよぴよぴよぴよぴよぴよ </div> ふがふがふがふがふがふがふがふ