CSS 위치 절대 전체 너비 문제

CSS 위치 절대 전체 너비 문제

---

2 div와 dl이 있습니다.

<div id="wrap">
 <div id="header">
  <dl id="site_nav_global_primary">

그리고 이것은 내 스타일입니다.

#wrap {
margin:0 auto;
width:100%;
min-width:760px;
max-width:1003px;
overflow:hidden;
}

#header {
width:100%;
position:relative;
float:left;
padding-top:18px;
margin-bottom:29px;
}

#site_nav_global_primary {    
float:right;
margin-right:18px;
margin-bottom:11px;
margin-left:18px;
}

이제 줄 바꿈과 헤더를 변경하지 않고 전체 화면 너비를 갖도록 site_nav_global_primary를 변경하고 싶습니다. 하지만 내가 시도 할 때 :

#site_nav_global_primary {    
position: absolute;
width:100%;
top:0px;
left:0px;
}

탐색은 최대 1003px 너비 인 래퍼의 100 %를 가져옵니다. 랩 및 헤더 div를 변경하지 않고 최대로 늘리고 싶습니다.

이것이 가능한가?

---

left및 right속성을 모두 0. 이렇게하면 div가 문서 너비로 늘어나지 만 상위 요소가 배치되지 않아야합니다 (이 경우 #header는 그대로 position: relative;표시됨).

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

데모 : http://jsfiddle.net/xWnq2/ , 여기서 제거 position:relative;했습니다.#header

---

position:relative#wrap 요소 에 추가해야합니다 .

이것을 추가하면 모든 자식 요소가 브라우저 창이 아닌이 요소에 배치됩니다.

---

비슷한 상황이 있습니다. 제 경우에는 position : relative를 가진 부모가 없습니다. 필요한 경우 여기에 내 솔루션을 붙여 넣으십시오.

position: fixed; left: 0; right: 0;

---

컨테이너보다 더 넓기를 원하는 이유는 무엇입니까? 나에게는 제약 조건에 묶이지 않으려면 포함 div 외부에서 dl을 가져와야 할 것 같습니다.

---

이것이 당신이 원하는지 모르겠지만 overflow : hidden from #wrap

---

#site_nav_global_primary고정 된 위치로 만들고 너비를 100 % 및 원하는 높이로 설정합니다.

---

이 답변으로 문제가 해결 될 것입니다. 부모 div에 상대적 위치가 있어야하며 너비가 100 % 인 자식 요소 (절대 위치)가 예상대로 작동합니다.

https://stackoverflow.com/a/58242149/11679888

참고URL : https://stackoverflow.com/questions/6625116/css-position-absolute-full-width-problem