Как расположить два элемента тимелист рядом друг с другом

Question

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

<div th:if="${isLogged}" class="div-block-10">
    <div class="user_name" th:text="${user.getFirstName() + ' ' +
        user.getLastName()}">Your Name</div>
    <div th:if="${!user.isEmailValidated()}" class="div-block-13">
        <div class="email_confirmed">
            <a th:href="@{'/email/send/' + ${user.getToken()}}">Your email is
                not confirmed!</a>
        </div>
    </div>
</div>

.div-block-10 {
    position: absolute;
    top: 0px;
    right: 0px;
    margin-top: 20px;
    margin-right: 40px;
    white-space: nowrap;
}

.div-block-13{
    position: absolute;
    top: 0px;
    right: 7px;
    margin-top: 50px;
    white-space: nowrap;
}

Я пытался изменить div-block-13 css, но не могу понятьКак разместить ссылку, чтобы появиться прямо рядом с именем пользователя.Я предполагаю, что есть способ поместить ссылку вместе с именем пользователя в элементе div-block-10.

Answer 1

Попробуйте следующий CSS:

.div-block-13{
  position: absolute;
  top: 0px;
  right: 7px;
  margin-top: 50px;
  white-space: nowrap;
  display:inline-block;
}