Горизонтально центр объекта внутри параллелограмма - PullRequest
Новая
       16

Горизонтально центр объекта внутри параллелограмма

0 голосов
/ 30 марта 2020

У меня сейчас есть параллелограмм, созданный с div и свойством css clip-path. Эта форма также прикреплена к нижней и нижней части экрана с динамической шириной c. Я пытаюсь понять, как центрировать содержимое по горизонтали (а не по вертикали).

Моя проблема в том, что любой текст, который я пытаюсь центрировать, кажется, центрируется по прямоугольнику, а не по параллелограмму, который я создал.

До сих пор я пытался использовать отступы слева и справа, поля в процентах и ​​пути обрезки содержимого внутри div безрезультатно.

Я прикрепил кодовую ручку к тому месту, где я сейчас нахожусь. Любая помощь будет принята с благодарностью.

1 Ответ

1 голос
/ 30 марта 2020

Вам необходимо добавить

text-algin-center;

к вашим .sidebar-callout-padding и

отображение: встроенный блок;

для ваших абзацев (присвойте им уникальный идентификатор) 

#wrapper {
  background-color: yellow;
  text-align: center;
}
#yourdiv {
  background-color: green;
  display: inline-block;
}
<div id="wrapper">    
    <div id="yourdiv">Your text</div>
</div>
...