コンテナーの幅より広がったエリアをcalcでつくる - Qiita
タイトルがなんともわかりづらいけど、キャプチャのような表現をする話。 記事の引用とかコードの表現でこういう見た目にしたいことがある。 やり方は色々あるけど、これをCSSのcalc()でやってみる。 記事全体を包括している親要素の幅が決まっていて、一部のブロック、セクションだけ左右ぶち抜きたい。 マークアップとCSSはこんな感じ。 <article class="entry"><!-- width: 44em; --> <h1 class="entry-title">セロ弾きのゴーシュ</h1> <div class="entry-body"> <p>...</p> <div class="dialogue"><!-- ぶち抜きたいところ --> <p>...</p> </div> <p>...</p> </div> </article>
css-eblog.com - このウェブサイトは販売用です！ - css eblog リソースおよび情報
This webpage was generated by the domain owner using Sedo Domain Parking. Disclaimer: Sedo maintains no relationship with third party advertisers. Reference to any specific service or trade mark is not controlled by Sedo nor does it constitute or imply its association, endorsement or recommendation.
CSS 途中で要素を画面いっぱいに広げる | テクニカルノート
ヘッダーや、フッターを画面いっぱいに広げる場合、widthを100%に指定すればいいだけですが。 mainの途中で背景だけ目一杯に広る場合、mainを2つに分けて、間に目一杯の枠を作る。なんてことをしてた時期がありまして。こんな感じで。 非常に効率が悪かったわけですが、できればこんなふうにmainの途中でも画面いっぱいに広がる枠を入れられたら楽ですよね。こんな感じで。 で、どうするかというと、意外と簡単で、広げたい部分をdiv要素で囲って、 幅方向のmarginにマイナスの値を設定して、マイナス分を、paddingで補います。 margin:0 -200%; padding:0 200%; とすれば、いいわけですが、それだけだと、はみ出た部分まで表示しようとスクロールバーが出てきてしまいます。なので、bodyに overflow-x: hidden; を適用すればいいのですが、なぜかiPh
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
