width값 없이 가운데 정렬 방법
연와인
하이브리드 앱 작업중인데요.
팝업 창을 브라우저 크기에 상관없이 항상 좌우 가운데 정렬 하려고 합니당.
근데 아시다시피 유동적일 수 있는 해상도를 고려하여 가로너비값을 정하지 않아야 하거든요.
어떻게 해야 고정된 너비값 없이 항상 가운데정렬될 수 있을까요??
팝업 부분만의 소스는 다음과 같아요..popup {position:absolute; top:120px; width:85%; min-width:280px; background:#fff;border-radius:8px;-moz-border-radius:8px;-webkit-border-radius:8px;box-shadow:0 0 5px 1px #bba0a2;-webkit-box-shadow:0 0 5px 1px #bba0a2;padding:10px 10px 20px;font-weight:bold; text-align:center; margin:0 auto; display:inline; overflow:hidden;}div class=popup
p class=noteimg src=res/images/common/ico_notice.gif alt=! //p
p class=cont업데이트가 중단 되었습니다.br /다시 업데이트 하시겠습니까?/p
p class=btns ac c_space02
span class=btn popbtna href=#예/a/span
span class=btn popbtn offa href=#아니오/a/span
/p
/divtext-align:center; margin:0 auto; display:inline; overflow:hidden; 등을 써주라고 해서 적용해봐도 안되더라구요.
min-width값을 넣어도 안되고... width값을 퍼센티지로 주니 안되네요.ㅜㅡ
방법 아시는 분 좀 알려주세요~~~~~.
-
다빈
기획을 바꿔야 할겁니다. absolute 레이어 안드로이드에서 테스트 해보시면 왜 그런지 아시게 될거에요...;;
-
키클
아.. 아래에 다른 내용들이 존재하고 그위에 띄우는 거라 그렇게 간단하지가 않네요...
님 말씀대로 하면 테이블이 깨져요...ㅠㅠ -
초코맛캔디
음.. 꼭 엡솔루트로 위치를 잡아야되나요??
.popup {position:relative; top:120px; width:85%; min-width:280px; background:#fff;border-radius:8px;-moz-border-radius:8px;-webkit-border-radius:8px;box-shadow:0 0 5px 1px #bba0a2;-webkit-box-shadow:0 0 5px 1px #bba0a2;padding:10p -
김애교
left 값이 없어서일거에요
popup 의 width 의 반만큼 margin-left:-42.5% 해주면 원하는데로 될거 같은데요 -
혁민
흠. 그럼 결국 스크립트의 힘을 빌리는수밖에 없지않을까 조심스레 의견을 내봅니다.
-
감추어왔던
말씀드린데로... 팝업창의 사이즈를 주지 않고 팝업의 너비를 유동적으로 가능하게 하려는 거라서..
제시하신 방법은 알고 있지만 적용하지 않았어요. 답변 감사드려요.. ^^ -
진주
예를들어
.popup {width:400px; height:400px;} 이라면
position:absolute; width:50%; height:50%; margin:-200px 0 0 -200px; 이렇게 해보심이.