I have a pretty tried and true method of distributing Divs, that can be described here and has a jsFiddle here. However, the html is very picky about its spacing.
I've been trying several different things, and I've ended up here:![8a4dc7fc0a7207effb5f50399b22e8.png]()
So knowing that this way of distributing divs is really picky about whitespace, I brought it into browser, to inspect, and people who know more about the way passages are output probably already see the problem:![88af5f30adfb0a30cb60e3739638f7.png]()
Just to make sure that this could actually work, I went ahead and edited in browser, and yeah it functions fine, as seen below.
![1ba49ba2a5864a0b2ccc334189b094.png]()
![bdf133f3ec1d8150aa2352e9603af0.png]()
So my question is this: Is there anyway that I can get the html to output properly and still be rendered in the passage? If not, is there another method of distributing divs that could yield basically the same results, assuming that there are more than two .paper divs? I have very little knowledge of Javascript, but I'm willing to start learning if it means I can craft a workaround.
Note: I've already tried editing the tw-passagedata in the HTML file itself, but that just causes the container div, and all of it's children to be excluded from the passage entirely.
EDIT: I actually just solved this on my own, though it's not exactly the prettiest way of doing things. For anyone who wants to know how you can equally space divs in a container, here's what I did to make it work (using the CSS listed in the JS Fiddle above).
![97f0dfd8063558dfd9775b59c2d55c.png]()
I was looking through the forums and stumbled over something unrelated about the print command, and I got the vague impression that if anything Really Simple would work, it would be that. I tried a few different escape characters before I got to the \r carriage return one, and that's the one that worked for me. \n was really wonky though.
Even though this has been solved, if there are any other solutions, like through Javascript that can target elements or something, I'd definitely like to hear them out though.
I've been trying several different things, and I've ended up here:
So knowing that this way of distributing divs is really picky about whitespace, I brought it into browser, to inspect, and people who know more about the way passages are output probably already see the problem:
Just to make sure that this could actually work, I went ahead and edited in browser, and yeah it functions fine, as seen below.
So my question is this: Is there anyway that I can get the html to output properly and still be rendered in the passage? If not, is there another method of distributing divs that could yield basically the same results, assuming that there are more than two .paper divs? I have very little knowledge of Javascript, but I'm willing to start learning if it means I can craft a workaround.
Note: I've already tried editing the tw-passagedata in the HTML file itself, but that just causes the container div, and all of it's children to be excluded from the passage entirely.
EDIT: I actually just solved this on my own, though it's not exactly the prettiest way of doing things. For anyone who wants to know how you can equally space divs in a container, here's what I did to make it work (using the CSS listed in the JS Fiddle above).
I was looking through the forums and stumbled over something unrelated about the print command, and I got the vague impression that if anything Really Simple would work, it would be that. I tried a few different escape characters before I got to the \r carriage return one, and that's the one that worked for me. \n was really wonky though.
Even though this has been solved, if there are any other solutions, like through Javascript that can target elements or something, I'd definitely like to hear them out though.