"틀:대문/style.css"의 두 판 사이의 차이

위키원
이동: 둘러보기, 검색
잔글 (Asadal님이 00 문서를 틀:대문/style.css 문서로 이동했습니다)
(내용을 " <style> @media (max-width: 600px) { .responsive-left, .responsive-right { width: 100% !important; } } </..."(으)로 바꿈)
1번째 줄: 1번째 줄:
/* [[위키백과:대문]], [[위키백과:사용자 모임]] 에 적용되는 css 값입니다.
+
    <style>
이 스크립트를 수정하기 이전에 [[틀:대문/임시2/style.css]]에서 정상적으로 동작하는지 확인해 주세요! */
+
        @media (max-width: 600px) {
 
+
            .responsive-left, .responsive-right {
.main-box {
+
                width: 100% !important;
background: #FFF;
+
            }
border: solid #C8CCD1;
+
        }
border-radius: 2px;
+
    </style>
border-width: 1px;
 
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.15);
 
padding: 0 0 0.5rem 0;
 
}
 
 
 
.main-top {
 
padding: 0 1.5rem 0 0;
 
align-items: center;
 
width: 100%;
 
box-sizing: border-box;
 
background-image: url("https://upload.wikimedia.org/wikipedia/commons/e/e3/Wikipedia_logo_letters_banner.svg");
 
background-position: right;
 
background-repeat: no-repeat;
 
}
 
 
 
.main-top-left {
 
flex: 3;
 
background-image: linear-gradient(to right, white 0%, white 33%, rgba(255, 255, 255, 0));
 
padding: 1rem 0 1rem 1.5rem;
 
}
 
 
 
.main-top-left-subtitle {
 
font-size: 1rem;
 
margin-top: 0.1em;
 
}
 
 
 
.main-top-left-subtitle-count {
 
font-size: 0.95rem;
 
}
 
 
 
.main-top-right {
 
flex: 2;
 
}
 
 
 
.main-top-right-text {
 
font-size: 1rem;
 
margin-top: 1em;
 
margin-bottom: 0;
 
text-align: right;
 
}
 
 
 
.main-pane {
 
display: flex;
 
}
 
 
 
.main-pane-left {
 
margin-right: 20px;
 
}
 
@media (max-width: 981px) {
 
.main-pane {
 
display: block;
 
}
 
.main-pane-left {
 
margin-right: 0;
 
}
 
.main-top {
 
flex-direction: column;
 
}
 
.main-top-left {
 
align-self: flex-start;
 
background-image: linear-gradient(to right, white 0%, white 66%, rgba(255, 255, 255, 0));
 
}
 
.main-top-left-subtitle {
 
font-size: 0.8em;
 
margin-left: 0.2em;
 
margin-top: 0;
 
}
 
.main-top-left>p:first-child {
 
margin-bottom: 0;
 
}
 
.main-top-right {
 
align-self: flex-end;
 
padding-left: 1rem;
 
}
 
.main-top-right-text {
 
font-size: 0.9rem;
 
margin-top: 0;
 
margin-bottom: 1rem;
 
}
 
}
 

2024년 6월 6일 (목) 16:49 판

   <style>
       @media (max-width: 600px) {
           .responsive-left, .responsive-right {
               width: 100% !important;
           }
       }
   </style>