Increase height of Neatline Timeline show view

Hello,

How can I increase the height of the actual timeline in the Show view of Neatline Timeline?

The months line is getting cutting off in my Timeline (http://familyhistory.cjroots.com/neatline-time/timelines/show/2) making it very hard to read. I don't find anything in the Timeline .css to fix this.

Thanks,
Colleen Greene

Hi Colleen,

Someone on a different thread was having a similar issue. Turns out this is a CSS issue that you'll need to resolve in the theme. Details are in this response I posted.

Best,
Jeremy

Do let me know if this helps fix your problem.

Sorry, didn't realize these were the same issue. I'll post on that forum. Not sure if I can mark this as a duplicate or delete it.

Sorry, I wasn't clear about the other thread. It wasn't originally about this issue, but was brought up and discussed. Certainly no need to apologize either way! But do let me know if the fix I linked to works for you.

Hi Jeremy,

I went with your suggestion on the other forum post.

Change to style.css in Seasons

.neatlinetime-timeline {
    overflow:hidden !important;
    padding: 0 !important;
}

.neatlinetime-timeline div {
    padding: 0 !important;
}

And making sure my NeatlineTime plugin public/timelines/show view is calling that div class "neatlinetime-timeline".

My timeline is at: http://familyhistory.cjroots.com/neatline-time/timelines/show/2

This increased the main bar in the timeline, which shows the markers and the months. But that now makes most of the purple year bar not visible.

I'd like to be able to set whatever height I want on the main bar that show the markers. Especially since I have some years (see 1945 adn 1945) that have a TON of items in the timeline, so I need more height.

But I'd also like the full purple year bar, and the months bar above those to both be fully visible.

I'd assumed this plugin new worked like Geolocation, which allows me to control a height and width on the Map view.

Thanks for any guidance!

Colleen

One last piece of CSS seems needed here. Looks like the theme includes the following property on some divs

box-sizing:border-box;

This has the effect of collapsing a box to the exact width/height specified. (e.g. padding, border, etc. are calculated as part of the over all width/height, and not added to that.)

You could override this, like do the other properties, by setting box-sizing to "content-box", which is the default value, like so:

.neatlinetime-timeline {
    overflow:hidden !important;
    padding: 0 !important;
    box-sizing: content-box;
}

.neatlinetime-timeline div {
    padding: 0 !important;
    box-sizing: content-box;
}

See if that helps?

Oh, and you may need to add !important after each of those, so they override the plugin theme. (You could also make the selector more specific.)

That seems to fix it. Thanks!