DIV를 전체 너비로 스케일하는 방법은 무엇입니까?

DIV를 창 너비의 100 % 대신 페이지 너비의 100 %로 설정하고 싶습니다.DIV를 전체 너비로 스케일하는 방법은 무엇입니까?

콘텐츠가 브라우저 창보다 넓 으면 DIV가 페이지 중간에서 끝나기보다는 전체 너비로 확장되도록하고 싶습니다 (width: 100%처럼).

으로 DIV에 중첩하면 기본적으로 작동하지만 200 % 내내 스크롤 할 수있는 부작용이 있습니다. 그리고 심지어 콘텐츠가 창 너비의 두 배를 초과하면 div가 공중에서 끝납니다.

예 : http://jsfiddle.net/nm64V/합니다 (3000px 넓은 내용이 나는 내용이 얼마나 넓은 모르는 내 프로젝트에서, 단지 예입니다 점에 유의하고 창 폭을 초과 할 경우하시기 바랍니다)

어떻게 할 설명 된 행동을 달성합니까?

2011-10-25 Cobra_Fast

당신의 HTML 및 BODY 스타일 폭뿐만 아니라 100 %로 설정이 있습니까? 이 DIV는 다른 태그 (BODY 태그 제외)에 중첩되어 있습니까? '... 디스플레이'와 '위치 : ...'당신은 잊고 될 수 속성을 당신 DIV가 제대로 작동 얻을. – bigp

'margin : 0'을 가지고있는 전체 래퍼 DIV에 중첩되어 있습니다. 이 래퍼 위의 다음 요소는 BODY입니다. –

내가 무엇을 당신이 원하는 것은 그런 것이 가능하다 생각하지 않습니다. 아마 당신이 달성하기를 원하는 구체적인 예를 들어 줄 필요가 있습니다.

그 때까지 나는 작동 할 수있는 하나의 추측을 제공합니다. 표 셀이 내용에 맞게 늘어나므로 주변 요소 (<body>이 작동 할 수도 있고 그렇지 않은 경우 추가하십시오) display: table-cell을 지정하십시오. display: table-cell을 지원하지 않는 구형 브라우저를 지원해야하는 경우 대신 내용 주위에 하나의 셀 테이블을 추가하십시오.

예 : http://jsfiddle.net/nm64V/2/

출처

2011-10-25 12:58:59 RoToRa

정확하게 수행하려고 시도하는 예를 제공해야합니다. DIV는 블록 요소이므로 빈 또는 부동 소수점이 아닌 한 항상 사용할 수있는 모든 너비를 사용해야합니다.

DIV 또는 페이지의 다른 부분에서 말하는 "내용"이 내부에 있습니까?

출처

2011-10-25 12:30:16 Leo

내 질문에 사례를 추가했습니다. –

내가 이해 한 바로는 div 세트의 모든 콘텐츠를 콘텐츠 크기로 래핑하여이 문제를 해결할 수 있습니다. 귀하의 예를 사용 : 이제

<div style="margin: 0"> 
    <div style="width: 3000px;"> 
     <div style="width: 100%; border: 1px solid red;"></div> 
     <div>... Your long content goes here ...</div> 
    </div> 
</div>

, 당신이로 컨테이너 사업부를 설정 어떤 폭은 (예를 들어, 1500px), 내부 (빨간색 테두리) 사업부와 콘텐츠 모두가 넘어 뻗어 경우에도 그 폭이 될 것입니다 브라우저 창 당신은 컨테이너 사업부가 될 것입니다 어떤 크기를 모르는 경우

, 테이크 아웃 '스타일 = "너비 : 3000px를,"'라인은, 그것은 여전히 작동합니다.

예 : http://jsfiddle.net/nm64V/1/

출처

2011-10-25 12:58:19 Anthony

DIV를 전체 너비로 스케일하는 방법은 무엇입니까?

답변

관련 문제