Задать вопрос
leshikgo
@leshikgo
html

Как лучше можно реализовать данный блок?

Здравствуйте. Есть блок вида:
046e49b9f51a42f98bae24507e86108a.png
Как сделать заголовок ровно по центру страницы, а кнопку по правому краю? Пока на ум только position:absolute приходит для кнопки, но это не вариант для меня(некрасиво это). Флоутами если делать то заголовок не по центру будет... Вроде легко, но что-то на ум не приходит, толи от усталости уже.. 
<div class="page-content__head">
      <h1 class="page-content__head-title">Kreditləşmə</h1>
      <a href="#" class="btn btn--green">Kredit hesablamaq</a>
    </div>
  • Вопрос задан
  • 289 просмотров
Комментировать
Подписаться 1 Оценить Комментировать
Решения вопроса 3
tomgif
@tomgif
Веб-разработчик
Флексбокс! Стильно, модно, молодежно!
.page-content__head {
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
}
Ответ написан
3 комментария
3 комментария
@Camaro67
Помог? - "Отметить решением"
А чем позиционирование не устраивает? Вполне нормальное решение.
.page-content__head {
  position: relative;
}

.btn {
  position: absolute;
  top: 0;
  right: 0;
}
Ответ написан
3 комментария
3 комментария
SuperToster
@SuperToster
Пожалуйста https://jsfiddle.net/muf8c244/

Но лучше переходите на flex.
Ответ написан
2 комментария
2 комментария
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы
Вакансии с Хабр Карьеры
Тестировщик-стажёр
ITooLabs • Тула
от 35 000 до 40 000 ₽
Fullstack PHP Developer
Smapse Education
от 40 000 до 65 000 ₽
Trainee - IT Support
move2usajobs.com LLC • Лос-Анджелес
от 2 000 до 4 000 $
Ещё вакансии
Заказы с Хабр Фриланса
Доработать и интегрировать модуль на WordPress
26 апр. 2024, в 19:53
5000 руб./за проект
Разработать Telegram mini app
15 апр. 2024, в 22:14
30000 руб./за проект
Сделать тг бота для сбора 4 данных в эксель + проверка на подписку
26 апр. 2024, в 19:17
1000 руб./за проект
Ещё заказы