태블릿을 위한 미디어쿼리가 동작하지 않습니다. 채택완료
반응형 디자인 웹사이트를 만들었는데 CSS가 꼬인 것 같습니다.
제 사이트(http://red2.net/rwd2/" target="_self">http://red2.net/rwd2/)에 들어가셔서 브라우저 너비를 768px~959px로 조절해보시면
분명히 테블릿용 CSS가 있는데 아무 변화가 없습니다.
(전체 CSS: http://red2.net/rwd2/css/default.css" target="_self">http://red2.net/rwd2/css/default.css)
어디가 잘못되었는지 모르겠네요. 그누 고수님들의 답변 기다립니다. ㅠㅠ.....
</span></p><p><span style="font-family: 돋움, Dotum, Helvetica, sans-serif; font-size: 12px; line-height: 1.5;"></span><font face="돋움, Dotum, Helvetica, sans-serif"><span style="font-size: 12px; line-height: 18px;">/* 태블릿용 CSS */</span></font></p><p><font face="돋움, Dotum, Helvetica, sans-serif"><span style="font-size: 12px; line-height: 18px;">
</span></font></p><p><font face="돋움, Dotum, Helvetica, sans-serif"><span style="font-size: 12px; line-height: 18px;">@media all and (min-width:768px){</span></font></p><p><font face="돋움, Dotum, Helvetica, sans-serif"><span style="font-size: 12px; line-height: 18px;">
</span></font></p><p><font face="돋움, Dotum, Helvetica, sans-serif"><span style="font-size: 12px; line-height: 18px;">#toggle-menu{</span></font></p><p><font face="돋움, Dotum, Helvetica, sans-serif"><span style="font-size: 12px; line-height: 18px;">position:absolute;</span></font></p><p><font face="돋움, Dotum, Helvetica, sans-serif"><span style="font-size: 12px; line-height: 18px;">/*</span></font></p><p><font face="돋움, Dotum, Helvetica, sans-serif"><span style="font-size: 12px; line-height: 18px;">top:0;</span></font></p><p><font face="돋움, Dotum, Helvetica, sans-serif"><span style="font-size: 12px; line-height: 18px;">left:-210px;</span></font></p><p><font face="돋움, Dotum, Helvetica, sans-serif"><span style="font-size: 12px; line-height: 18px;">display:block;</span></font></p><p><font face="돋움, Dotum, Helvetica, sans-serif"><span style="font-size: 12px; line-height: 18px;">*/</span></font></p><p><font face="돋움, Dotum, Helvetica, sans-serif"><span style="font-size: 12px; line-height: 18px;">}</span></font></p><p><font face="돋움, Dotum, Helvetica, sans-serif"><span style="font-size: 12px; line-height: 18px;">
</span></font></p><p><font face="돋움, Dotum, Helvetica, sans-serif"><span style="font-size: 12px; line-height: 18px;">.content{</span></font></p><p><font face="돋움, Dotum, Helvetica, sans-serif"><span style="font-size: 12px; line-height: 18px;">display:flex;</span></font></p><p><font face="돋움, Dotum, Helvetica, sans-serif"><span style="font-size: 12px; line-height: 18px;">flex-direction:column;</span></font></p><p><font face="돋움, Dotum, Helvetica, sans-serif"><span style="font-size: 12px; line-height: 18px;">}</span></font></p><p><font face="돋움, Dotum, Helvetica, sans-serif"><span style="font-size: 12px; line-height: 18px;">
</span></font></p><p><font face="돋움, Dotum, Helvetica, sans-serif"><span style="font-size: 12px; line-height: 18px;">.latest-article{</span></font></p><p><font face="돋움, Dotum, Helvetica, sans-serif"><span style="font-size: 12px; line-height: 18px;">width:50%;</span></font></p><p><font face="돋움, Dotum, Helvetica, sans-serif"><span style="font-size: 12px; line-height: 18px;">/* border:1px solid #000; */</span></font></p><p><font face="돋움, Dotum, Helvetica, sans-serif"><span style="font-size: 12px; line-height: 18px;">/* 스타일이 안먹힌다 -_-a */</span></font></p><p><font face="돋움, Dotum, Helvetica, sans-serif"><span style="font-size: 12px; line-height: 18px;">}</span></font></p><p><font face="돋움, Dotum, Helvetica, sans-serif"><span style="font-size: 12px; line-height: 18px;">
</span></font></p><p><font face="돋움, Dotum, Helvetica, sans-serif"><span style="font-size: 12px; line-height: 18px;">/* 모바일에서 제목을 제외한 것들을 다시 보여준다. */</span></font></p><p><font face="돋움, Dotum, Helvetica, sans-serif"><span style="font-size: 12px; line-height: 18px;">#board-table thead tr th:first-child, #board-table tbody tr td:first-child,</span></font></p><p><font face="돋움, Dotum, Helvetica, sans-serif"><span style="font-size: 12px; line-height: 18px;">#board-table thead tr th:nth-child(2), #board-table tbody tr td:nth-child(2),</span></font></p><p><font face="돋움, Dotum, Helvetica, sans-serif"><span style="font-size: 12px; line-height: 18px;">#board-table thead tr th:nth-child(4), #board-table tbody tr td:nth-child(4),</span></font></p><p><font face="돋움, Dotum, Helvetica, sans-serif"><span style="font-size: 12px; line-height: 18px;">/* #board-table thead tr th:nth-child(5), #board-table tbody tr td:nth-child(5), */</span></font></p><p><font face="돋움, Dotum, Helvetica, sans-serif"><span style="font-size: 12px; line-height: 18px;">#board-table thead tr th:nth-child(6), #board-table tbody tr td:nth-child(6){</span></font></p><p><font face="돋움, Dotum, Helvetica, sans-serif"><span style="font-size: 12px; line-height: 18px;">display:table-cell;</span></font></p><p><font face="돋움, Dotum, Helvetica, sans-serif"><span style="font-size: 12px; line-height: 18px;">}</span></font></p><p><font face="돋움, Dotum, Helvetica, sans-serif"><span style="font-size: 12px; line-height: 18px;">
</span></font></p><p><font face="돋움, Dotum, Helvetica, sans-serif"><span style="font-size: 12px; line-height: 18px;">}</span></font><span style="font-family: 돋움, Dotum, Helvetica, sans-serif; font-size: 12px; line-height: 1.5;"> </span></p><p><font face="돋움, Dotum, Helvetica, sans-serif"><span style="font-size: 12px; line-height: 18px;">
답변 3개
@media screen and (min-width: 768px) and (max-width: 959px)
min 값과 max 값도 한번 넣어봐주세요
댓글을 작성하려면 로그인이 필요합니다.
http://jigsaw.w3.org/css-validator/validator">http://jigsaw.w3.org/css-validator/validator
CSS 유효성 검사해서 고치다보니 되네요.
두분 감사합니다.
댓글을 작성하려면 로그인이 필요합니다.
답변을 작성하려면 로그인이 필요합니다.
로그인