White-space property for Bootstrap 4

user_9026504 0
Viewed 17721

I've been trying to find the bootstrap equivalent of the CSS property "white-space: break-spaces" but I can't seem to find one.

My problem is that in the mobile view of my screen, the button goes out of the view since the text in it is long.

This is my button

<button class="btn btn-primary mt-3" id="send_sms_btn" type="submit">Verify &amp; Submit Withdrawal</button>

CSS property applied to the element works fine but I can only use bootstrap. Any suggestions?

bootstrap-4 css html
2 Answers

Try adding the .text-break class to the button

<button class="btn btn-primary mt-3 text-break" id="send_sms_btn" type="submit">Verify &amp; Submit Withdrawal</button>

Text break reference Link

user_41143900 
<style>    
button.overflow {
          white-space: nowrap; 
          width: 100%; 
          overflow: hidden;
          text-overflow: ellipsis; 
          border: 1px solid #000000;
}
</style>

Add this style in css file or head tag.

 <button class="btn btn-primary mt-3 overflow" id="send_sms_btn" type="submit">Verify &amp; Submit too too long long long long long text</button>

use overflow class in button. It will not go out of the screen. Let's try. Hope will solve issue.

user_42184270
Related