1원팁) 헤더가 fixed 일때 내부링크시 상단 가려지는 문제 해결법
[code]
<header>
상단 고정 헤더
<a href="#sec">본문으로 이동</a>
</header>
...
...
...
<div class="sec" id="sec">
본문
</div>
[/code]
위와 같은 코드가 있고 <header>가 fixed 일때 내부링크 #sec 를 클릭하면 상단 고정된 헤더에 시작 부분이 가려잡니다.
이때는 아래와 같이 하면 헤더의 높이만큼 여백을 포함하기 때문에 정확히 출력됩니다.
[code]
.sec::before {
content: '\00a0'; // 그냥 공백으로 하면 안나올 수 있다.
display: block;
margin: -100px 0 0; // 100px 는 헤더 height
height: 100px; // 100px 는 헤더 height
}
[/code]
댓글 2개
4년 전
감사합니다
Bsori
4년 전
감사합니다.
게시판 목록
그누보드5 팁자료실
| 번호 | 제목 | 글쓴이 | 날짜 | 조회 |
|---|---|---|---|---|
| 공지 | 3년 전 | 4402 | ||
| 2634 | 6개월 전 | 609 | ||
| 2633 | 6개월 전 | 598 | ||
| 2632 |
 bank365 |
6개월 전 | 508 | |
| 2631 | 6개월 전 | 569 | ||
| 2630 |
세르반데스
|
6개월 전 | 538 | |
| 2629 | 6개월 전 | 727 | ||
| 2628 | 6개월 전 | 412 | ||
| 2627 | 6개월 전 | 417 | ||
| 2626 |
이슈DEV
|
7개월 전 | 636 | |
| 2625 |
welcome
|
7개월 전 | 645 | |
| 2624 |
이슈DEV
|
7개월 전 | 449 | |
| 2623 | 7개월 전 | 407 | ||
| 2622 | 7개월 전 | 496 | ||
| 2621 | 7개월 전 | 350 | ||
| 2620 |
 cdisk1 |
7개월 전 | 369 | |
| 2619 | 7개월 전 | 479 | ||
| 2618 | 7개월 전 | 465 | ||
| 2617 | 7개월 전 | 555 | ||
| 2616 | 7개월 전 | 678 | ||
| 2615 | 7개월 전 | 582 | ||
| 2614 | 7개월 전 | 410 | ||
| 2613 |
바닐라코드
|
8개월 전 | 730 | |
| 2612 | 8개월 전 | 594 | ||
| 2611 | 8개월 전 | 731 | ||
| 2610 | 8개월 전 | 966 | ||
| 2609 | 8개월 전 | 508 | ||
| 2608 | 8개월 전 | 653 | ||
| 2607 | 8개월 전 | 631 | ||
| 2606 | 8개월 전 | 576 | ||
| 2605 | 8개월 전 | 602 |
댓글 작성
댓글을 작성하시려면 로그인이 필요합니다.
로그인하기