два div, лежащих горизонтально по центру в обертке div

Question

Я пытаюсь создать элемент html как на изображении. Кнопки в порядке, но я не могу правильно установить два div ниже. Пробовал множество комбинаций float, position, display и т. Д. c. но ничего не работало. Мне не разрешено менять панель навигации css.

#navbar5 {
  float: left;
  width: 35%;
}

<div id="navbar5">
  <button> abc </button>
  <button> def </button>
  <div id="one"> xxxxxxx </div>
  <div id="two"> yyyyyyy </div>
</div>

Answer 1

#navbar5 {
  width: auto;
  text-align: center;
  float: left;
}

.simple_text {
  display: flex;
  justify-content: center;
}

#two,
#navbar5 button:last-of-type {
  margin: 0 0 0 10px;
}

<div id="navbar5">
  <button> abc </button>
  <button> def </button>
  <div class="simple_text">
    <div id="one"> xxxxxxx </div>
    <div id="two"> yyyyyyy </div>
  </div>
</div>