6/21 과제 : table 태그 없이 CSS로 달력 만들기

div, span 요소 및 CSS를 활용하여 아래 이미지처럼 달력 만들기

 

https://github.com/ebulsok/KDT-hw-621.git

GitHub - ebulsok/KDT-hw-621

첫 주의 월화수목을 그냥 빈 컨텐츠로 두면 div요소들이 어긋나길래

임의로 0을 넣고, 글자색을 흰색으로 설정해서 어찌저찌 만들었다.

 

다른 분들도 같은 고민을 많이들 하셨는지 수요일에 교육받으러 갔을 때 강사님이 두가지 방법을 알려주셨다.

1. span 태그에 vertical-align: bottom; 라는 속성을 추가한다.

- vertical-align 속성은 inline / inline-block일 때 기본값으로 baseline을 갖기 때문에 빈 컨텐츠일 때와 아닐 때의 정렬이 달라진 것이다.

2. 공백문자(&nbsp)를 넣는다