Альтернатива float для почтовых клиентов

Что является альтернативой для почтовых клиентов?

Вот что я использую с плавающей запятой. И мне нужен альтернативный подход, чтобы точно сохранить поведение.

html

<div class = "container">
  <div class = "leftText">
    left text
  </div>
  <div class = "rightText">
    right text right text
  </div>
</div>

css

.leftText {
  display: inline-block;
  border: 1px solid green;
  background: yellow;
}

.rightText {
  display: inline-block;
  float: right;
  border: 1px solid green;
  background: cyan;
}

jsfiddle

Вот что я пытался сделать, используя доступные во всех почтовых клиентах text-align и calc (calc доступен согласно это).

html

<div class = "container">
  <div class = "leftText">
    left text
  </div>
  <div class = "rightText">
    right text right text
  </div>
</div>

css

.leftText {
  display: inline-block;
  border: 1px solid green;
  background: yellow;
}

.rightText {
  display: inline-block;
  text-align: right;
  width: calc(100% - 58px);
  min-width: 122px;

  border: 1px solid green;
  background: cyan;
}

jsfiddle

Этот подход не работает таким образом, что когда правый текст перемещается в его собственную строку, слова не переносятся из-за установки min-width. Если бы можно было добавить перенос слов после того, как правый текст переместился в отдельную строку, это решение было бы тем, что я ищу.

Согласно это Outlook не поддерживает display: table, и после тестирования это оказалось правдой. Поэтому, пожалуйста, не советуйте мне использовать display: table или аналогичный дисплей (например, inline-table, table-row, table-column, table-cell и т. д.).