Vertical Spacing
Posted 01/22/22, by Dan VisStarting in version 7.08, I've completely swapped out how vertical space is managed in BoltWire, and it involves pretty much ditching the longstanding <p> tag. Here's what is happening...
From the beginning, I've attempted to create intuitive vertical spacing in BoltWire and have been reasonably successful. When you enter line breaks into your text, they show up in the html. And for the most part, it's wysiwyg: what you see is what you get...
But it's never been perfect. Sometimes you have to fiddle with things a bit to get the exact vertical spacing you desire. Maybe add an extra <br> or use css to slightly shift the height of a table or div, or add some hardspaces to force a line break, etc. And the more you try and fine tune things the more you have to tweak other things to get it all to work together. It's not a huge issue, but it's one of those minor nuisances that keeps popping up now and then.
Well, today I was trying to improve the brains in BoltWire to solve an irritating detail related to this, and ended up deconstructing the whole vertical spacing process and rebuilding it. Turns out there was a far easier way to manage things, and so far it's giving pretty amazing results (both in the displayed output and in the underlying html). And while I may not have accounted for every possible markup or combination thereof, so far it's all working flawlessly--and producing beautiful, elegant code. And it's far simpler, meaning we could easily tweak things further if I did miss something.
There's one drawback however: I eliminated the <p> tag and switched to using a double <br> tag at the end of each line instead. I won't get into all the reasons, but essentially, forcibly inserting the <p> tag was the problem all along, because it was virtually impossible to tell when a line was a paragraph or something else--at least not in every case. And that ambiguity was really the root problem. Leading to more and more complex code, and flawed output. Using line breaks just solves the whole issue.
I went back through most of my main site and the display was pretty much identical. And wherever things were shifted one way or another, by the change, in editing the page, I found every time, it was caused by some jury-rigging fix that was no longer needed. Deleting those "tweaks", and everything fixed itself beautifully. In other words, the only problems were my complicated, time consuming, and hard to figure out, wonky, workarounds... :)
Anyway, I've decided to put this new approach into the core. I suspect it may cause some issues with html validation--and there may be accessibility implications--but I'm not really sure about either. And in every other way, it's just better.
I recognize, in some cases there may be a need for p tags so I'm planning to add some markup to manually indicate when a line of text should be wrapped in a paragraph tag. At the moment I'm thinking of a single "." at the beginning of a line of text would work nicely.
The change might also require a change in your css so the paragraph vspace and the line break vspace don't double up in your output. But that's easy enough.
On my site, I haven't found a single instance where the absence of <p> tag adversely affects the display, and the html is actually a lot more readable. And as usual, if you don't like the new approach--I'll be adding a plugin to the core for restoring the old behavior. Just put enableVspace in your site.config page, and everything will go back to the way it was. :)
So what do you think? The BoltWire site is running on this right now. Notice any changes? Any feedback on introducing this change? Are we being just a bit too much of a rebel?
Comments
Join Us
To read more posts, or to leave a comment, join our FREE community...JOIN NOW