그래서 다음 코드가 있습니다.
<div class="col-md-2">
<div class="panel">
<div class="btn-group-vertical btn-block">
<button type="button" class="btn btn-default btn-lg">
<div style=" SEE QUESTION ">
Here is some very long text on purpose here is some very long text on purpose here is some very long text on purpose
</div>
</button>
</div>
</div>
</div>
그리고이 bootply 에서 볼 수 있듯이 style
마지막 속성에 무엇을 입력하든 상관없이 디스플레이가 예상과 다릅니다<div>
. 나는 많은 것들과 같은 시도했습니다 width:100%
, word-break: break-all
, word-wrap: break-word
, 등
태그 의 btn
클래스 와 관련이 있다고 생각 합니다 <button>
(제거하면 버튼 내부의 텍스트가 예상대로 동작하지만 어떤 CSS 속성 btn
이 동작을 강제 하는지 찾을 수 없습니다 ...
분명히, 텍스트가 버튼 내에서 허용되는 최대 너비에 도달하면 텍스트가 깨질 것으로 예상합니다 (디스플레이가 어떻게 보일지에 대한 예시를 bootply에 넣었습니다 (다소)).
감사
문제는이다 .btn
가 white-space: nowrap;
(부트 스트랩의 기본적으로)
그래서 당신은 white-space: normal;
.
이 기사는 인터넷에서 수집됩니다. 재 인쇄 할 때 출처를 알려주십시오.
침해가 발생한 경우 연락 주시기 바랍니다[email protected] 삭제
몇 마디 만하겠습니다