개발자 시선

  • 홈
  • 태그
  • 방명록

CSS 1

html에서 텍스트가 줄바꿈 되지 않는 문제 해결하기

문제 상황html로 긴 글을 표현할 때, 우리는 아래 이미지처럼 정해놓은 영역(파란색 박스) 내에서 html 태그가 감싸져서 글이 표현될 거라고 생각합니다. 하지만 예상과 달리, 정해놓은 영역(빨간색 박스)을 벗어나서 아래 이미지처럼 표현이 되는 경우가 있습니다.  html이 렌더링 될 때, 여러 번 공백이 입력이 되었어도 하나의 공백으로 입력되어 표현되기 때문에 위 이미지처럼 보여지게 되는데요.이런 상황에서는 어떻게 해결해야할까요? 문제 해결 방법white-space 속성을 사용하면 됩니다. white-space는 요소가 공백 문자를 처리하는 법을 지정하는 css 속성입니다. 문제가 발생한 html 태그의 css 속성에 white-space를 추가해주면 줄바꿈이 적용됩니다. // html 댓글을 작성..

개발 지식/css 2024.09.17
이전
1
다음
더보기
프로필사진

개발자 시선

개발자 시선으로부터-

  • 분류 전체보기 (20)
    • 개발 지식 (16)
      • git (1)
      • react (1)
      • css (1)
      • next.js (1)
      • tailwind css (1)
      • UI와 UX (5)
      • Flask와 Jinja2 (4)
      • 알고리즘 (1)
      • 웹 성능 최적화 (1)
      • 라이브러리 만들기 (0)
    • 프론트엔드 실무 (0)
      • 회고록 (0)
      • 커뮤니케이션 (0)
    • 개발하는 일상 (3)
    • 독서 (1)
    • 후기 (0)
      • 교육 (0)

Tag

웹 성능 최적화, react, UI/UX, 바이브코딩, 컨펌셰이밍, 시각적 무게, 약관 동의 UI, Prettier, react-pdf변환, 개발, next.js, 성장일지, 충주맨, git, 피츠의 법칙, 독서, 오픈소스기여, 김선태, 시각적 앵커, PDF, 데이터 결산 서비스, flask, 말풍선, Portal, tailwindcss, 홍보의신, ai, 모바일웹, 회고, jinja2,

최근글과 인기글

  • 최근글
  • 인기글

최근댓글

Copyright © AXZ Corp. All rights reserved.

티스토리툴바