</p>
<p>body, html {
margin: 0;
padding: 0;
display: flex;
flex-direction: column;
height: 100vh;
}
header {
line-height: 100px;
text-align: center;
}
nav {
background: #0af;
top: 0;
position: sticky;
line-height: 30px;
text-align: center;
}
.main {
background: #1a1;
height: auto;
text-align: center;
flex: 1 1 auto;
justify-content: center;
}
footer {
background: #834;
text-align: center;
}</p>
<p>아이프레임에 스티키 메뉴 적용하기 채택완료
Winter0
4년 전
조회 2,058
안녕하세요
레이아웃은 html이고(그누보드 테마 아님) nav에 sticky를 사용한 레이아웃을 쓰고 있습니다
html 파일 안에 내용을 쓰면 스티키 메뉴가 잘 됩니다
하지만 main에서 그누보드를 아이프레임으로 불러오면, 아이프레임안에서만 스크롤이 됩니다. 스티키 메뉴가 아니라 그냥 평범한 메뉴에 아이프레임을 쓴 것처럼 돼버려요
보통 홈페이지나 블로그처럼 내용에 따라서 스크롤이 주욱 됐으면 좋겠어요. 스티키 메뉴가 활성화되게요.
방법 아시는 분 부탁드립니다(__)
</p>
<article>
<p><!DOCTYPE html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<link rel="stylesheet" href="test.css">
</head>
<body>
<header>
header
</header>
<nav>
nav
</nav>
<div class="main">
<iframe src="<a href="http://naver.com"" target="_blank" rel="noopener noreferrer">http://naver.com"</a> style="width:100%; height:100%; border:none"></iframe>
</div>
<footer>
</footer>
</body>
</html></p>
<p>
댓글을 작성하려면 로그인이 필요합니다.
답변 2개
4년 전
sticky가 iframe안에서 먹을 까요? css sticky는 브라우저의 탑부분을 찾아서 붙여주는 것인데
그래서 일부 브라우저별로 동작이 조금씩 다른 경우가 생깁니다.
아마도 iframe안에서 붙여줄려고 하면 javascript로 별도로 만들어 주어야 될 것입니다.
로그인 후 평가할 수 있습니다
답변에 대한 댓글 1개
W
Winter0
4년 전
어떻게 되긴 됐는데 이중스크롤이 생기네요^^ㅠㅠㅠ
댓글을 작성하려면 로그인이 필요합니다.
4년 전
로그인 후 평가할 수 있습니다
답변에 대한 댓글 1개
W
Winter0
4년 전
자세히 보니 아이폰ios 관련 문제 같은데 제가 고민하는 부분과는 연관이 없는듯합니다ㅠㅠ; 제가 잘 못한 걸 수도 있지만요..
댓글을 작성하려면 로그인이 필요합니다.
답변을 작성하려면 로그인이 필요합니다.
로그인