divを画面全体の幅にするにはどうすればよいですか？

div Aが別のdiv（B）の幅500pxに含まれている場合、div Aは画面全体の幅になりますか？私はその500pxのdivの "ブレークアウト"したい。divを画面全体の幅にするにはどうすればよいですか？

2012-05-07 TIMEX

'window '幅を取得し、CSSの幅をjsで設定します。あなたのアイテムが高いzindexで絶対的な位置に置かれている限り、それはうまく動作するはずです – elclanrs

div Aにはposition:absoluteを使用できます。最も近い位置にある親（固定、絶対または相対位置のいずれかを持つ親）が見つかります。しかし、最も近い位置にある要素の幅を100％にして、左にぴったりと配置する必要があります。ボディ

<body> 
    <div id="b"> 
     <div id="a">test</div> 
    </div> 
</body> 

body{ 
    position:relative; 
} 

#b{ 
    width:500px; 
} 

#a{ 
    position:absolute; 
    top:0; 
    left:0; 
    right:0; 
}

出典

2012-05-07 07:46:18 Joseph

あなたのフィドルでは 'body 'の代わりに' .body'です。 – gdoron

@gdoronドットを削除するのを忘れました。ありがとう！ – Joseph

子divにposition: absoluteを使用し、親をposition: staticに保ちます。

出典

2012-05-07 07:46:15 alex

div Aの位置を作成することができます：絶対;

出典

2012-05-07 07:46:16 bunsiChi

を使用して

here's a demoそれはあなたがそれが見えるようにしたいかに依存します。 CSSを使用した：

overflow:hidden;

することは、それが含むdiv要素の上部に表示させたい場合は、 "を使用することができ、それ以外のdivを含むdiv要素よりも大きくなるようにするが、その背後に隠れ、

ます与えられた他の答えと同じように 'position' css。

出典

2012-05-07 07:48:14 Th0rndike

divタグにクラスまたはIDを追加できます。 div bの http://jsfiddle.net/HRT2M/

.b 
{ 
Position:fixed; 
}

それはあなた

あなたはMIN-幅を使用することができマーティン

出典

2012-05-07 07:48:40 defau1t

のために動作しますdiv Bを特定の幅に強制する -

<div id="a" style="width:500px;display:block;"> 
    <div id="b" style="min-width:960px;"> 
    </div> 
</div>

また、その幅を設定するためにJavaScriptを使用することができます -

<script style="text/javascript"> 
window.onload = function() { 
    document.getElementById ("b").style.width = window.screen.width; 
} 
</script>

出典

2012-05-07 07:49:22 SmithMart

のために働いて取得する必要があります。このCSSはあなたのためにjsfiddleは両方

#yourdivid .yourdivclass { 
    position:absolute; 
    left:0; 
    right:0; 
    overflow:hidden; 
}

出典

2012-05-07 07:58:54 Tom

<div id="b" style="width:500px;"> 
    <div id="a" style="width:100%; position:absolute; overflow:hidden;"><div/> 
</div>

これは動作します。

出典

2012-05-07 08:34:57 JasonMortonNZ

divを画面全体の幅にするにはどうすればよいですか？

答えて

関連する問題