저번에 [티스토리/· 스킨편집] - 티스토리 오디세이 스킨 - 슬로건, 배너 위치 바꾸는 방법 글을 썼는데요.
이에 질문을 주셔 글로 남겨봐요.
▲ PC 화면에는 순서가 배너 - 슬로건입니다.
▲ 근데 화면 크기를 줄이면... 즉, 폰으로 보면 슬로건 - 배너 순서로 바뀌는군요. 저도 처음 알았어요. 다른 블로그에 오디세이를 쓰고는 있지만 배너랑 슬로건을 사용하지 않아서 말입니다.
▲ CSS 편집에서 다음 태그를 찾습니다. 저는 CSS 편집을 자주 해서 원래는 307번 줄이 아닐 수 있으니 근처에서 저 부분을 찾아주세요.
@media screen and (min-width: 1061px) {
[중간 생략]
.wrap-drawer .header .area-align {
display: flex;
flex-wrap: wrap;
flex-direction: column-reverse; ▶ flex-direction: column로 바꿔주고 저장합니다.
}
태그를 설명하면...
화면 크기가 1061px 미만일 때
flex는 반응형 페이지를 만드는데 아주 편리한 태그입니다.
flex-direction은 아이템의 정렬 방향을 지정하는데요. column-reverse는 영어 그대로 세로 방향을 거꾸로 한다입니다. 그러니 column으로 쓰면 순서가 바뀌지 않습니다.
답변 완료! 질문자님 덕에 글 하나 씁니다. 호호~
flex에 관한 글은 예약글로 되어 있은데 아마 10월 중순에나 발행이 시작 될 것 같습니다.