Центрирование div по вертикали при использовании shape-outsideCSS

Разбираемся в CSS
Ответить
Anonymous
 Центрирование div по вертикали при использовании shape-outside

Сообщение Anonymous »

Я пытаюсь добиться этого эффекта, когда текст обволакивает контур изображения, но при этом центрируется
Проблема в том, что я не могу использовать shape-outside: url() , чтобы обернуть текст, мне нужно разместить изображение, а это означает, что родительский элемент не может быть гибким или сеточным. Это затрудняет центрирование элементов по вертикали.
Я пробовал использовать top: 50%, а затем перевести y на -50%, но это не приводит к переводу контура фигуры. что текст обтекает. , похоже, не имеет никакого эффекта, а другие предложения, такие как display:table ивертикальное выравнивание:middle, нарушают необходимое плавающее положение.
Просто немного застрял. Предпочел бы только css, но при необходимости доволен js. Буду признателен за любую помощь!
Что мне нужно:
[img]https:/ /i.sstatic.net/Z4M5btom.png[/img]

Что у меня есть на данный момент:
Изображение


Код: Выделить всё

.shape-outside {
shape-outside: url(https://9gdz2scbii.ufs.sh/f/zWQ2Yd3CAlqfqpqn7xOJVXdr2TwsUaM9xB8kENtWjbYcPCoz);
shape-margin: 25px;
display: flow-root;
}

Код: Выделить всё





[img]https://9gdz2scbii.ufs.sh/f/zWQ2Yd3CAlqfqpqn7xOJVXdr2TwsUaM9xB8kENtWjbYcPCoz[/img]

a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a





Подробнее здесь: https://stackoverflow.com/questions/793 ... pe-outside
Ответить

Быстрый ответ

Изменение регистра текста: 
Смайлики
:) :( :oops: :roll: :wink: :muza: :clever: :sorry: :angel: :read: *x)
Ещё смайлики…
   
К этому ответу прикреплено по крайней мере одно вложение.

Если вы не хотите добавлять вложения, оставьте поля пустыми.

Максимально разрешённый размер вложения: 15 МБ.

Вернуться в «CSS»