태그를 사용하여 메뉴에 이력서 제출 이라는 링크를 넣으려고합니다 li. 두 단어 사이의 공백으로 인해 두 줄로 줄 바꿈됩니다. CSS로이 줄 바꿈을 방지하는 방법은 무엇입니까?
답변
사용 white-space: nowrap;[1] [2] 또는 설정에 의해 그 링크가 더 많은 공간을 제공 li큰 값의 폭.
[1] § 3. 공백 및 줄 바꿈 : 공백 속성-W3 CSS 텍스트 모듈 레벨 3
[2] 공백-CSS : CSS (Cascading Style Sheets) | MDN
답변
내용이 한 줄에 맞도록 큰 경우이 작은 코드 조각을 추가하여 줄 끝에 멋진 “…”을 추가 할 수 있습니다.
li {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}답변
이를 선택적으로 달성하려면 (예 : 특정 링크로만) 일반 공간 대신 중단되지 않는 공간을 사용할 수 있습니다.
<li>submit resume</li>https://en.wikipedia.org/wiki/Non-breaking_space#Encodings
편집 : OP가 요청한 CSS가 아닌 HTML임을 이해하지만 도움이 될 수 있습니다.
답변
디스플레이 : 인라인 블록; 목록 항목에서 단어 사이의 구분을 방지합니다.
li {
display: inline-block;
}답변
Bootstrap 4에는라는 클래스가 text-nowrap있습니다. 필요한 것입니다.
답변
