HTML

Programming Language/CSS

[CSS] 텍스트 줄바꿈 / 말줄임 방법 정리

최근 토스에서 Frontend Accelerator 1기를 모집하여, 신청하여 객관식 시험을 볼 수 있었는데,모두 골라야한다는 점이 확실히 알고 있어야하는 것인데, 100% 확신하는가라고 생각했던 문제가 거의 없었던 것 같다.그 중 텍스트 줄바꿈 속성에 관한 문제도 있었어서, 적어보려고 한다.텍스트 줄바꿈 방법 1. white-space  <div class="text-container"> This is a long text that we want to wrap naturally to the next line without breaking words.</div> .text-container { width: 200px; white-space: normal; /* 기본값 */}..

Programming Language/CSS

[CSS] 요소 수평, 수직 정렬 정리

요소 수평 / 수직 정렬 방법1. 수평 정렬a) Flexbox 사용: Centered Element.flex-center { display: flex; justify-content: center;}b) Grid 사용: Centered Element.grid-center { display: grid; justify-content: center;}c) Position 사용: Centered Element.position-center { position: relative;}.position-center .element { position: absolute; left: 50%; transform: translateX(-50%);}d) Table 레이아웃 사용: Centered Element..

개발자참치
'HTML' 태그의 글 목록