Centering a div vertically... (Kevin's shape-outside video)
So I'm following Kevin's video on using shape-outside: https://www.youtube.com/watch?v=sifXs4XVK7g
It's probably a skill issue, but while it works great for say the start of articles, it seems limited if the text doesn't take up more height than the image?
For example, it seems almost impossible to center any text vertically with the image, because the wrapper is
display:block?
https://codepen.io/nwoodward/pen/WbezJvY
If anyone's got any ideas on how to align the items vertically I'd appreciate it!Kevin Powell
YouTube
Wrap text around any image or shape that you want with shape-outsid...
The first 1000 people to use the link will get a free trial of Skillshare Premium Membership: https://skl.sh/kevinpowell03211
Shape-outside is such an awesome CSS property, and it brings floats back to relevance!
ā¹ More information: https://developer.mozilla.org/en-US/docs/Web/CSS/shape-outside
š» Browser support: https://caniuse.com/?search=sh...
1 Reply
apparently there's no way to do it without JS https://stackoverflow.com/questions/61992180/how-to-vertically-center-text-within-a-circle-created-with-shape-outside
Stack Overflow
How to vertically center text within a circle created with shape-ou...
I have a paragraph element with some text that I have contained inside the confines of a circle by relying on the shape-outside CSS property. The HTML and CSS code thus far are as follows:
#