CSS를 사용하여 줄 바꾸기가 아닌 텍스트보다 작게 버튼이 축소되는 것을 방지하려면 어떻게해야합니까?

Question

본질적으로 "Delete"라는 단어가 포함 된 버튼이 있습니다. 또한 COL-XS-2 및 사용

.btn-delete { 
    font-size: 32px; 
    background-image: none; 
    border: 1px solid transparent; 
    border-radius: 15px; 
    border-top: 0px; 
    color: #fff; 
    background: linear-gradient(to bottom, #ff0000, #d40000); 
    vertical-align: middle; 
    text-align: center; 
} 

COL-XS를 오프셋-3 :

그것은 현재이 CSS를 사용한다.

창을 가로로 작게 만들면 단추의 배경이 축소되고 "D"부분 만 표시 될 때까지 "삭제"텍스트가 천천히 잘라집니다.

버튼이 글꼴 텍스트를 자르지 않게하려면 어떻게해야합니까? 텍스트가 잘려나 가기 전에 버튼이 줄어들지 않게하고 싶습니다.

Answer 1

예, min-width = xxx를 사용하고 min-height = xxx도 고려해야 삭제가 읽을 수 있습니다. 텍스트에 맞는 픽셀 크기로 설정하십시오.

또 다른 옵션은 삭제 버튼 이미지를 만들고 그 최소값도 지정하는 것입니다. 그러나 이것은보다 복잡한 솔루션입니다.