0

введите сюда описание изображения Как делать такие элементы? (обвел красным) через after и before? Или через абсолютное позиционирование? И не сломается ли это все при адаптиве?

1
  • а чем плохо сделать такие элементы обычными блоками?
    – teran
    8 апр 2021 в 15:17

1 ответ 1

1

Вы можете использовать обычный блок и повернуть текст с помощью css свойства writing-mode https://caniuse.com/css-writing-mode

Пример:

section {
  font-family: 'Arial';
  max-height: 200px;
  margin: 10px;
  border: 1px solid #000;
  padding: 10px;
  background-color: #464646;
}

.vertical-rl {
  writing-mode: vertical-rl;
  color: #fff;
  font-weight: 900;
  text-transform: uppercase;
}

body {
  background-color: white;
}
<section class="vertical-rl">
  <p>Вертикальный текст</p>
</section>

1
  • 1
    Или использовать transform: rotate(-90deg); с префиксами?
    – Blondguy
    9 апр 2021 в 14:11

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge you have read our privacy policy.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.