HTML CSS сдвиг кнопки и текста вправо

Question

Имеется html:

<div class="col-md6 border rounded" style="margin: 1.3%; padding: 10px">
    <h2>ЛСД</h2>
    <div style="font-size: 115%">
        ЛСД (ЛСД-25, LSD, от нем. Lysergsäurediethylamid)
    </div>
    <div>
        Автор - <a href="/user/1">YaAlex</a>
        <div style="text-align: right;display: inline-block;">Дата написания - 23 May 23:16
            <a href="/news/1" class="btn btn-primary register">
                Перейти
            </a>
        </div>
    </div>
</div>

пока что автор (тоже кнопка, на это можно не обращать внимания), дата написания и кнопка находятся на одном уровне, и прижаты влево. Как разместить автора - прижатым влево, а дату написания и кнопку - вправо? примерно так:

Имя дата [кнопка]

Answer 1

На flex это не сложно, разумеется что ширина в 250px это условно

Менять надо только содержимое outer1 или outer2

.item {
  display: flex;
  align-items: center;
  width: 250px;
}

.outer2 {
  margin-left: auto;
}

<div class="item">
  <div class="outer1">
    Имя
  </div>
  <div class="outer2">
    <span>25.01.2021</span>
    <button>Кнопка</button>
  </div>
</div>

БЛОГ НА HUSL

HTML CSS сдвиг кнопки и текста вправо

Ответы (1 шт):