Struggling to remove line breaks from tags

I’m trying to display content on a page in div tags. Using some Javascript has allowed me to put them in “spoiler” blocks. But the div tags are managing to have 2 line breaks before them, and I want none.

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.