Как сделать такое обтекание текста под углом?
Ответ
https://css-tricks.com/almanac/properties/s/shape-outside/
.block{
overflow: hidden;
margin: 10px;
padding: 15px;
}
.pict{
float:left;
width:100px;
height:150px;
margin:10px;
background-color: #ccc;
-webkit-shape-outside: polygon(100% 50%, 0 0, 0 100%);
shape-outside: polygon(100% 50%, 0 0, 0 100%);
-webkit-clip-path: polygon(100% 50%, 0 0, 0 100%);
clip-path: polygon(100% 50%, 0 0, 0 100%);
-webkit-shape-margin: 10px;
shape-margin: 10px;
}
text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text
или
.block{ overflow: hidden; margin: 10px; padding: 15px; } .pict{ float:left; width:100px; height:150px; margin:10px; background-color: #ccc; -webkit-shape-outside: polygon(0 0, 100% 50%, 100% 100%, 0% 100%); shape-outside: polygon(0 0, 100% 50%, 100% 100%, 0% 100%); -webkit-clip-path: polygon(0 0, 100% 50%, 100% 100%, 0% 100%); clip-path: polygon(0 0, 100% 50%, 100% 100%, 0% 100%); -webkit-shape-margin: 10px; shape-margin: 10px; }
text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text
Комментариев нет:
Отправить комментарий