diff --git a/MAWPUB/view/css/com/common.layout.css b/MAWPUB/view/css/com/common.layout.css index 7e7de4b..57e84a2 100644 --- a/MAWPUB/view/css/com/common.layout.css +++ b/MAWPUB/view/css/com/common.layout.css @@ -13,17 +13,17 @@ } /* 전체레이아웃 */ -#wrap {min-width: 320px; /* height: 100%; overflow: hidden; */} -#page {position: relative; z-index: 0; width: 100%; /* height: 100%; overflow: auto; */} /* [P]IOS 스크롤바가 일부 요소(z-index값이 있는)에 숨겨지는 이슈 z-index:0 추가 */ -#header {position: sticky; z-index: 11; top: 0; height: var(--header-height); background-color: var(--color-primary); box-sizing: content-box;} -/* #main {height: 100%;} */ -#header ~ #main {/* height: calc(100% - var(--header-height)); */ padding-top: 0;} -#content {position: relative; /* height: 100%; */} +#wrap {min-width: 320px; height: 100%; overflow: hidden;} +#page {position: relative; z-index: 0; width: 100%; height: 100%; overflow: auto;} /* [P]IOS 스크롤바가 일부 요소(z-index값이 있는)에 숨겨지는 이슈 z-index:0 추가 */ +#header {position: sticky; z-index: 11; top: 0; height: var(--header-height); background-color: var(--color-light); box-sizing: content-box;} +#main {height: 100%;} +#header ~ #main {height: calc(100% - var(--header-height)); padding-top: 0;} +#content {position: relative; height: 100%;} #footer {} -/* [data-page-main="true"] #main {height: auto;} +[data-page-main="true"] #main {height: auto;} [data-page-main="true"] #header ~ #main {height: auto;} -[data-page-main="true"] #content {height: auto;} */ +[data-page-main="true"] #content {height: auto;} .section {padding: var(--space-lg) var(--space-body) var(--space-xxl);} .section + .section {padding-top: 0;} diff --git a/MAWPUB/view/css/com/common.reset.css b/MAWPUB/view/css/com/common.reset.css index cb875bb..1669f3d 100644 --- a/MAWPUB/view/css/com/common.reset.css +++ b/MAWPUB/view/css/com/common.reset.css @@ -152,7 +152,7 @@ body, button, dd, dl, dt, fieldset, form, h1, h2, h3, h4, h5, h6, legend, ul, ol, li, p, input, select, textarea, table, th, td {margin: 0; padding: 0;} html {-webkit-text-size-adjust: none; -webkit-tap-highlight-color: transparent; background-color: var(--color-light); font-size: 62.5%;} body {text-rendering: optimizeLegibility; -webkit-font-smoothing: antialiased; font-family: 'Pretendard', Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Roboto, 'Helvetica Neue', 'Segoe UI', 'Apple SD Gothic Neo', 'Noto Sans KR', 'Malgun Gothic', 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', sans-serif; line-height: 1.5; font-size: var(--font-md); font-weight: var(--font-regular); color: var(--color-txt-body);} -/* html, body {overflow: hidden; height: 100%;} */ +html, body {overflow: hidden; height: 100%;} button, input, select, textarea {max-width: 100%; font: inherit; box-shadow: none; background-color: transparent;} button, [type=button], [type=reset], [type=submit] {-webkit-appearance: button; appearance: button;} canvas, img, picture, svg, video {display: block; max-width: 100%; -webkit-touch-callout: none; -webkit-user-select: none; -moz-user-select: none; -ms-use-select: none; user-select: none;} diff --git a/MAWPUB/view/html/com/com/com/test.html b/MAWPUB/view/html/com/com/com/test.html index 0e43ef9..c3db89c 100644 --- a/MAWPUB/view/html/com/com/com/test.html +++ b/MAWPUB/view/html/com/com/com/test.html @@ -151,7 +151,7 @@

- +
@@ -209,11 +209,11 @@

} setTimeout(() => { element.scrollIntoView({ behavior: 'smooth', block: 'start' }); + document.querySelector('#text1 > em').innerHTML = nowScrollTop; + document.querySelector('#text2 > em').innerHTML = (nowScrollTop + element.getBoundingClientRect().top) - (document.querySelector('#header').scrollHeight * 2); + document.querySelector('#text3 > em').innerHTML = `window.innerHeight=${window.innerHeight}, document=${document.documentElement.clientHeight}, visualviewport=${window.visualViewport.height}`; }, 100); - document.querySelector('#text1 > em').innerHTML = nowScrollTop; - document.querySelector('#text2 > em').innerHTML = (nowScrollTop + element.getBoundingClientRect().top) - (document.querySelector('#header').scrollHeight * 2); - document.querySelector('#text3 > em').innerHTML = `window.innerHeight=${window.innerHeight}, document=${document.documentElement.clientHeight}, visualviewport=${window.visualViewport.height}`; } } commUiFocusInputText.init();