Hi Natasha,
Thank you for reaching out to us. To answer your questions:
1) In previous releases’ we had adjusted the spacing for the end user. This was both good and bad in that it helped lay out the timeline a bit nicer (when users were using longer announcement excerpts), but when things weren’t set up just right the containers would overlap. It turned out more often than not that the containers were overlapping for people, and they were forced to adjust the CSS to fix it.
In our most previous release, we removed the spacing so there was no overlap for anyone. To work around this issue, we’ve written a documentation article on how and where to make the changes to adjust the spacing on larger devices. The article can be found here: http://www.wp-timelineexpress.com/documentation/adjust-spacing-announcement-containers/
You’ll see that we have provided a snippet to adjust the containers on desktop screens only,b but you can make the alterations to adjust the mobile devices (if needed).
Alternatively, our pro version has a different method of laying out the containers and actually does it’s best to lay them out as close as possible without an overlap. The demo that you see at http://www.wp-timelineexpress.com/examples/basic-timeline/ is our pro version – and thus why your timeline and the one in the demo appear different. Purchasing the pro version would layout your timeline differently so it looks more like the one in the demo, but you can use CSS to make the tweaks to the free version.
2) Timeline Express does it’s best to inherit the template from your theme – but not all themes will work out of the box. Again, we have put together a documentation article on how to setup a custom single announcement view – so it fits in seamlessly with your theme. Take a look at the article here, http://www.wp-timelineexpress.com/documentation/customize-single-announcement-template/. Follow those steps to duplicate your themes single.php template, and things should look perfect.
Let us know if you have any further questions.
