What I want to do is similar to text box wrapping in Photoshop/Illustrator/other software, you can write a paragraph but if it "overflows" it will jump to another text box and just like fill that text Same as the box.
If possible, I would like to be able to achieve this functionality using only HTML/CSS without using JavaScript, or at least know that this is not possible and I should turn to other solutions.
Visual example of what I want: https://i.stack.imgur.com/Dzbhv.jpg
I've tried every property I've seen for CSS text wrapping, and also web scraped, but I haven't seen anything that resembles what I want.
![[Web front-end] Node.js quick start](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
You can set the number of words displayed to prevent going outside the box (classic "read more"), but I suspect you can only achieve this using html/css.
Of course, I could be wrong, but I don't see html or css that can communicate, cut content and automatically jump to the next div based on specific conditions.
I got a pretty close suggestion elsewhere and I'm posting here to help others who may need it, there doesn't seem to be a free floating method, however,
column-(x)Property seems to be the best option.Some documentation can be found here: https://www.w3schools.com/css/css3_multiple_columns.asp
The way I implemented it is to assign it a self-describing class (threeColumnDiv in this case) and use it whenever I need it.
Another thing that seems like it might be ideal is the grid-row attribute (reference: https://www.w3schools.com/cssref/pr_grid-row.php).
If there's anything else needed, it seems like you're going to have to do it in a custom way, but I feel like these edge cases are rare and shouldn't be a big issue.
Thank you everyone for your response and help on this issue!