div영역 밖으로 삐져 나오는 현상
흰여울
일단 주된 질문을 하기 이전에 크로스브라우징이라고하면 모든 브라우져를 최대한 맞쳐줘야하는거 이외에 익스에서 호환성보기를 했을때 까지도 맞쳐줘야하는지 궁금하네요~
이제 주된질문!0. 호환성보기를 킵니다.1. 팝업을 엽니다.2. 주소를 검색합니다.3. 추가버튼을 눌러 여러개 주소를 입력합니다.4. 입력한 주소는 스크롤이 적용되어있는 div안에 테이블에 td로 한줄씩 추가할때마다 입력이 됩니다. td의 내용은 주소랑 CSS로 만든 삭제버튼입니다.5. 아주 깔끔히 잘나옵니다.6. 확인을 눌러 팝업을 닫습니다.
여기까진 이상이 없습니다.
7. 팝업을 다시 엽니다. 다시열땐 기존에 추가된 주소가 그대로 불러옵니다.td부분을 유심히 살펴보면 주소는 td안에 박혀 잘나오는데 CSS로만든 버튼은 td에 나타나질 않습니다.이 버튼들이 div영역에 속해있지 않은것처럼 보입니다. 스크롤을 아무리 내리고 올려도 그 버튼들은그냥 절대좌표에 top, left를 적용한것처럼 같이 딸려 올라가질 않습니다.pop_scroll06에 inline을 하면 잘나오긴 하는데 스크롤이 나오질 않네요....HTMLdiv class=pop_scroll06span class=button btn_04input type=button value=삭제 //span/divCSS - DIV.pop_scroll06 {overflow-y:scroll; overflow-x:hidden; width:100%; border:1px solid #d7dadb; height:150px;}CSS - 버튼 공통.button,
.button *{position:relative; margin:0; padding:0; display:inline-block; text-decoration:none !important; border:0; font-size:12px; white-space:nowrap; background:url(/femispo/com/new_femis/images/n_btn/button.gif) no-repeat; vertical-align:top; overflow:visible; font-weight:bold; color:#333;}.button *{cursor:pointer; _cursor:hand;}
.button span {padding:0 0 0 10px !Important; width:16px;}CSS - 버튼.button.btn_04, .button.btn_04 *{height:16px; line-height:16px; background-position:left -60px; color:#fff !Important;}
.button.btn_04 *{padding:0 11px; font-size:11px; font-weight:normal; background-position:right -60px;}
-
검사
아;; 필요한 부분만 소스 가져올려고 정리하다보니까 제가 테이블 부분을 빠트렸네요 ㅎㅎ 내용은 같이 들어가 있어요~ 답변 감사합니다 ^^
-
맞빨이
마크업 수정없이 css만으로 해결되었다면, 다행이구요.
주소에 뿌려지는 내용하고 삭제 버튼하고 따로따로 넣으신거 같아서 말씀드려봣어요.
원래 제대로 된것이라면 하나의 td안에 내용과 버튼이 같이 있는 형태가 맞거든요.
또는 각각의 td가 될 수도 있게지만요. -
연연두
아주 잘나오네요~ 근데 마크업 수정할 부분이 어디인지도 알려주시면... ㅎㅎ
-
찬바리
마크업부터 수정해야 할것같은 느낌이 듭니다만, .button에 position:relative를 삭제해보세요.