css 줄바꿈 없애기

0 투표
css 스타일시트로 문장 줄바꿈이 되지 않도록 설정하는 방법 알려주세요.

css 줄바꿈 방지

1 답변

0 투표

css 에서 줄바꿈을 방지하기 위해서 아래와 같이 설정하시면 됩니다.

div {white-space: nowrap;}

white-space 속성은 내부에서 자동 줄 바꿈 여부를 설정하는 값 입니다. 이 속성값은 상속됩니다. 

속성값

  • normal : 기본값으로 글자 줄이 자동으로 바뀐다. 콘텐츠가 요소의 너비를 초과할 경우 다음 줄로 바뀐다.
  • nowrap : 줄 바꿈이 실행되지 않는다. 콘텐츠가 다음 줄로 바뀌지 않는다.
  • pre : 줄 바꿈과 기타 공백이 유지된다. 이 가능한 값은 !DOCTYPE 선언에서 표준 준수 모드를 지정할 경우에 지원된다. !DOCTYPE 선언에서 표준 준수 모드를 지정하지 않으면 이 값을 검색할 수는 있지만 렌더링에 양향을 주지 않으며 normal 값처럼 동작한다.
  • pre-line : 줄 바꿈 시퀀스가 유지된다.
  • pre-wrap : 줄 바꿈 시퀀스가 축소된다.
  • inherit : 부모 요소로부터 값을 상속 받는다.

추가로 자바스크립트를 이용한 방법

object.style.whiteSpace="pre";

► pre는 인터넷익스플로러, 크롬, 사파리, 파이어폭스, 오페라 등 대부분 브라우저가 지원합니다. 

add
...