Trigger Text Alignment

I’m currently using the following shortcode to display my content under a photo.
[expand title="First Title" rel="program-highlander"]First Content paragraph[/expand]   |   [expand title=" Second Title" rel="program-highlander"]Second Content paragraph[/expand]

I’m using some custom CSS: .collapseomatic {display: inline;} to get my two Triggers Titles to display inline. The problem I’m having is that when the “First Title” trigger is clicked, the “First Content Paragraph” appears and forces the “Second Title” trigger out of alignment until it’s closed. How can I force the First Content to display below the Second Title trigger? I’ve tried using this css: .collapseomatic_content { position: absolute; } but it just cuts off the content text after a few lines instead of showing all the content.

Thanks!