사용자

NodeulsumNaru(비교)

 r15 vs r16
 ...
 }}}[각주]
 ====== .. ======
 {{{#!style
-/* 전체 컨테이너 */
+/* 1. 전체 외곽 디자인 */
 .stel-tab-container {
     margin: 20px auto; max-width: 540px;
     border: 1px solid rgba(255, 255, 255, 0.4); border-radius: 35px; overflow: hidden;
 ...
     box-shadow: 0 25px 50px rgba(255, 154, 139, 0.4);
 }
-/* 상단 탭 버튼 영역 */
+/* 2. 상단 탭 네비게이션 */
 .stel-tab-nav {
     display: flex; justify-content: center; background: rgba(0,0,0,0.1); backdrop-filter: blur(5px);
-    position: sticky; top: 0; z-index: 10;
 }
 .stel-tab-btn {
     padding: 12px 20px; font-weight: bold; font-size: 14px; color: #fff !important; text-decoration: none;
 }
-/* 🔥 핵심: 내용이 들어갈 상자 (높이를 고정하고 넘치는 부분을 숨김) */
-.stel-scroll-box {
-    height: 450px; /* 이 높이를 이미지/내용 크기에 맞춰 꼭 조절해주세요! */
-    overflow: hidden;
-    scroll-behavior: smooth; /* 부드럽게 넘어가게 함 */
+/* 3. 🔥 핵심: 내용이 보이는 창 (이 높이 밖의 내용은 숨김) */
+.stel-content-window {
+    height: 460px !important; /* 창 높이: 내용물 크기에 맞춰 조절 */
+    overflow: hidden !important;
+    position: relative;
+    background: rgba(255, 255, 255, 0.05);
 }
-/* 각 기수별 컨텐츠 상자 (스크롤 상자와 높이를 맞춰야 함) */
-.tab-section {
-    height: 450px; /* 위 stel-scroll-box의 height와 동일하게 설정 */
+/* 4. 각 기수별 페이지 (창 높이와 똑같이 맞춰야 함) */
+.tab-page {
+    height: 460px !important;
     padding: 15px 10px;
-    text-align: center;
-    background: rgba(255, 255, 255, 0.05);
     box-sizing: border-box;
+    text-align: center;
 }
-/* 뱃지 스타일 */
+/* 뱃지 디자인 */
 .m-badge-slim {
     display: inline-block; padding: 2px 10px; margin: 3px 1.5px; border-radius: 3px;
     font-size: 12px; font-weight: 800; color: #5a4fcf !important;
 ...
 {{{#!wiki class="stel-tab-container"
 {{{#!wiki class="stel-tab-nav"
-[[#s-tab1|{{{#!wiki class="stel-tab-btn"
-기생}}}]] [[#s-tab2|{{{#!wiki class="stel-tab-btn"
-기생}}}]] [[#s-tab3|{{{#!wiki class="stel-tab-btn"
+[[#s-gen1|{{{#!wiki class="stel-tab-btn"
+기생}}}]] [[#s-gen2|{{{#!wiki class="stel-tab-btn"
+기생}}}]] [[#s-gen3|{{{#!wiki class="stel-tab-btn"
 기생}}}]]}}}
-{{{#!wiki class="stel-scroll-box"
-{{{#!wiki id="s-tab1" class="tab-section"
+{{{#!wiki class="stel-content-window"
+[anchor(gen1)]
+{{{#!wiki class="tab-page"
 [[파일:스텔 1기.png|width=100%]]
 {{{#!wiki style="margin-top: 15px;"
 {{{#!wiki class="m-badge-slim" style="border-left: 5px solid #8182b8;"
 ...
 }}}
 }}}
-{{{#!wiki id="s-tab2" class="tab-section"
+[anchor(gen2)]
+{{{#!wiki class="tab-page"
 [[파일:스텔 2기.png|width=100%]]
 {{{#!wiki style="margin-top: 15px;"
 {{{#!wiki class="m-badge-slim" style="border-left: 5px solid #9EB5EE;"
 ...
 }}}
 }}}
-{{{#!wiki id="s-tab3" class="tab-section"
+[anchor(gen3)]
+{{{#!wiki class="tab-page"
 [[파일:스텔 3기.png|width=100%]]
 {{{#!wiki style="margin-top: 15px;"
 {{{#!wiki class="m-badge-slim" style="border-left: 5px solid #B8A9CA;"
 ...
 [[하나코 나나|나나]]}}}
 }}}
 }}}
 }}}
 }}}