Development22 [TIL] 2021-07-31 1. flexbox가 아닌 text-align 속성을 이용해서 요소를 정렬할 수 있다. 현대 브라우저에서 어떤 요소를 중앙에 배치하려면 display: flex; justify-content (en-US): center;를 사용하면 됩니다. 하지만 플렉스 박스 레이아웃을 지원하지 않는 Internet Explorer 8-9 등 오래된 브라우저를 지원해야 하면 margin: 0 auto;를 대신 사용하세요. (출처: MDN) body { text-align: center } 2. margin: auto; 브라우저가 적절한 여백 크기를 선택. 예를 들어 요소를 중앙 정렬하고 싶을 때 사용할 수 있다. (엘리코딩 실습5에서 사용) +) margin 값으로 %(percentage)도 사용가능. 3. flex와 .. 2021. 8. 1. [TIL] 2021-07-30 1. 어떤 요소의 위치를 변경할 때, padding값을 주는 것 말고 transform을 사용하면 반응형으로 만들 수 있음 .cursor { transform: translate(-50%, -50%) } - translate 속성을 이용해 element의 반절만큼 이동하게 함 2. inline, inline-block, block의 차이 ▷ inline: 사용자가 지정하는 box의 값을 무시하고 content 자체의 크기로 CSS가 설정됨 ▷ inline-block: inline처럼 한 줄에 나타나지만 지정된 box의 크기도 설정됨 (inline과 block의 속성을 모두 가지고 있음) ▷ block: 한 줄에 하나 3. CSS position https://betterme.tistory.com/11 4.. 2021. 7. 30. 이전 1 2 3 다음
