The [+] symbols, ideally, would be adjacent to the word above, instead of two lines down. I've tried googling the issue and it seems there are two solutions - either use display: inline or float: left, but neither are producing the desired results. Note that because I have block element content that I can't simply switch to spans (which would fix the formatting issue instantly, however. An alternative solution would be to get lists and tables to display properly inside of a span, but I spent hours on that and got nowhere, as display:inline on the list didn't do the job.)
As far as I can tell, there are three places that I have affecting the formatting.
I have the div tag immediate surrounding the content. Putting in style='float: left' or style='display: inline' doesn't remove the spacing. I have the class the div tag is defined as a member of and its location is in my css in the header. I'm pretty sure that neither of these are the culprit, as they display when the [+] is pressed, and are set to display: none by default.
Finally, the js supporting file I have is adding the following:
<div class='inline-spoiler-toggle' title='Show Spoiler' slider-id='I" + i + "'>[+]</div>
However, I've tried adding both potential fixes there as well to no effect. Also, I don't understand why this segment is adding two line breaks, while div tags usually only add one.