CSS3-ms-max-content в IE11

Мы можем установить в CSS3 -moz-max-content (для Firefox) и -webkit-max-content (для Chrome, Safari) как width, но, похоже, -ms-max-content не работает в Internet Explorer (IE11).

Обновление: Вот пример кода: 

.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>
1 6
css css3 internet-explorer-11

1 ответ:

-max-content он не поддерживается IE, согласно CanIuse .

Поэтому я создал запасной вариант для IE, который может помочь вам, установив .button в display:inline-block: 

.button {
  background: #d1d1d1;
  margin: 2px;
  cursor: pointer;
  width: -moz-max-content;
  width: -webkit-max-content;
  width: -o-max-content;
  /* width: -ms-max-content;*/
}
/* fallback for IE*/

.button {
  display: inline-block;
}
<div>
  <div class="button">Short t.</div>
  <div class="button">Looooooong text</div>
  <div class="button">Medium text</div>
</div>

Обновление:

На основе комментария OP:

Это работает, но я не хочу отображать элементы в строке.

Вот окончательный ответ: 

.button {
  background: #d1d1d1;
  margin: 2px;
  cursor: pointer;
  width: -moz-max-content;
  width: -webkit-max-content;
  width: -o-max-content
  /* width: -ms-max-content;*/
}
/* fallback for IE*/
.width {
  width:100%
}
.button {
  display: inline-block;
}
<div>
  <div class="width">
    <div class="button">Short t.</div>
  </div>
  <div class="width">
    <div class="button">Looooooong text</div>
  </div>
  <div class="width">
    <div class="button">Medium text</div>
  </div>
</div>
7