We can set in CSS3 -moz-max-content (for Firefox) and -webkit-max-content (for Chrome, Safari) as width, but it seems -ms-max-content is not working in Internet Explorer (IE11).
-moz-max-content
-webkit-max-content
width
-ms-max-content
Update: Here is a sample code:
.button { background: #d1d1d1; margin: 2px; cursor: pointer; width: -moz-max-content; width: -webkit-max-content; width: -o-max-content; width: -ms-max-content; }
<div> <div class="button"> Short t. </div> <div class="button"> Looooooong text </div> <div class="button"> Medium text </div> </div>
This works on IE11, Chrome and Firefox
instead of
width: -moz-max-content; width: -webkit-max-content; width: -o-max-content; width: -ms-max-content;
I used
width: auto; white-space: nowrap;
2.1m questions
2.1m answers
60 comments
57.0k users