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 팁자료실
| 번호 | 제목 | 글쓴이 | 날짜 | 조회 |
|---|---|---|---|---|
| 2665 |
선택과집중
|
3개월 전 | 559 | |
| 2664 |
|
3개월 전 | 609 | |
| 2663 |
|
3개월 전 | 565 | |
| 2662 |
선택과집중
|
3개월 전 | 495 | |
| 2661 | 3개월 전 | 579 | ||
| 2660 |
Modify
|
3개월 전 | 644 | |
| 2659 |
선택과집중
|
3개월 전 | 404 | |
| 2658 | 3개월 전 | 443 | ||
| 2657 |
|
4개월 전 | 955 | |
| 2656 |
선택과집중
|
4개월 전 | 537 | |
| 2655 | 4개월 전 | 394 | ||
| 2654 |
선택과집중
|
4개월 전 | 575 | |
| 2653 | 4개월 전 | 387 | ||
| 2652 | 4개월 전 | 437 | ||
| 2651 |
선택과집중
|
4개월 전 | 316 | |
| 2650 |
선택과집중
|
4개월 전 | 414 | |
| 2649 | 4개월 전 | 434 | ||
| 2648 |
welcome
|
4개월 전 | 537 | |
| 2647 |
디지털홍익인간
|
4개월 전 | 446 | |
| 2646 | 4개월 전 | 456 | ||
| 2645 |
선택과집중
|
4개월 전 | 501 | |
| 2644 | 4개월 전 | 447 | ||
| 2643 | 4개월 전 | 364 | ||
| 2642 | 4개월 전 | 348 | ||
| 2641 | 4개월 전 | 385 | ||
| 2640 | 4개월 전 | 1349 | ||
| 2639 |
|
5개월 전 | 499 | |
| 2638 |
세르반데스
|
5개월 전 | 390 | |
| 2637 |
선택과집중
|
5개월 전 | 557 | |
| 2636 |
선택과집중
|
5개월 전 | 672 |
댓글 작성
댓글을 작성하시려면 로그인이 필요합니다.
로그인하기