Notice
Recent Posts
Recent Comments
Link
«   2025/01   »
일 월 화 수 목 금 토
1 2 3 4
5 6 7 8 9 10 11
12 13 14 15 16 17 18
19 20 21 22 23 24 25
26 27 28 29 30 31
Tags more
Archives
Today
Total
관리 메뉴

moozi

하단고정레이아웃 본문

TIS_2018/응용sw2018_1기

하단고정레이아웃

moozi 2018. 6. 14. 14:53

<!doctype html>

<html>

<head>

<title>하단고정레이아웃</title>

<meta charset="UTF-8" />

<style>

html {  overflow: hidden;  }

html, body { width: 100%; height: 100%; margin: 0; padding: 0;}

#wrapper{  width: 100%; height: 100%; position: absolute; overflow-y:scroll;}


#content { 

    width: 100%; height: 1000px; 

    margin-left: -17px; /* 우측 스크롤바가 보여야 하므로 17px만큼 외쪽으로 땡겨주기 */

    padding-left: 17px; /* 좌측으로 들어간만큼 패딩값 지정 */

    }


#footer { 

    overflow: hidden;

    position: absolute;

    bottom: 0; 

    height: 50px; width:100%; text-align: center;

    margin-left:0px; margin-bottom:-1px;

    }


</style>


</head>


<body>


<div id="wrapper">


    <div id="content">

        본문내용... 

    </div>

        

</div>


    <div id="footer">

    풋터내용

    </div>

    

</body>

</html> 

'TIS_2018 > 응용sw2018_1기' 카테고리의 다른 글

스프링 무한스크롤  (0) 2018.06.20
Timestamp 와 Date  (0) 2018.06.14
jstl 이중for문  (0) 2018.06.12
6/4 uploadAjax.jsp  (0) 2018.06.04
프로젝트문서  (0) 2018.05.31
'TIS_2018/응용sw2018_1기' Related Articles more
Comments