HTML CSS помещают текст в среднюю вертикальную и горизонтально в DIV с формируемой посадкой [дублировать] ⇐ CSS

[Anonymous]

Как разместить текст в середине div?

javascript solution также приемлемо. Но не в середине ромба. < /P>

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

div.box {
--s:450px;

height: var(--s);
width:  var(--s);
clip-path: polygon(0 50%,50% 100%,100% 50%,50% 0);
background: #333;
color:#fff;
margin:30px auto 0;
font-size:20px;
text-align:justify;
}

.box i,
.box::before {
content: '';
float: left;
height:100%;
width: 50%;
shape-outside: conic-gradient(from 45deg at 0 50%,transparent 90deg,#fff);
}

.box i {
float: right;
shape-outside: conic-gradient(from 225deg at 100% 50%,transparent 90deg,#fff);
}< /code>

[i][/i]
Lorem ipsum dolor sit amet, eget orci, tinci dunt place rat in sociis. Pel lentes que ultri cies. Lorem ipsum dolor sit amet

Подробнее здесь: https://stackoverflow.com/questions/796 ... iv-with-sh