Neatline: misaligning timeline entries?

We're jumping into a Neatline 2 project and have run into an odd little quirk that we're hoping to get help with. We have the timeline for our exhibit set to "day", and have both single-day dates and date ranges in the exhibit, but the dots and lines that appear are half a bubble off (to the left) of the line for the day. I've tried a few different themes but the problem seems to persist across themes. (As an aside, the "winter" theme in Seasons seems to chop the "base" text in the timeline (in this case, the days) off completely...) Is this a CSS issue? or something else? Trying to figure out how to precisely mark the days. Thanks for any and all help!

Hey Jen,

Hmm, I think I've seen this crop up before, and I believe it's related to how SIMILE Timeline handles timezone differences (although I had thought that we fixed this problem - apparently not). I've filed a ticket on GitHub [1], and will investigate.


[1] -

Hi, I just wanted to jump in here because we posted (TDouty posted) a question about the Timeline chopping off the description in the Seasons theme. We are having that problem which JenB posted. I am also pretty sure I saw a similar problem in the ITEM display where the metedata blocks were floating over the collection image but can't find that page now.

Could someone please help us out with this? We aren't able to use any descriptions on our timelines because the description will be only partially visible to the public or maybe not at all. We are using Omeka 2.0.4 and version 2.0.2 of Neatline Time. Thanks.

Can someone point to a public web page where this happening? Would be helpful in debugging.


Click on Historical Timelines and then "Cecession in the Newspapers". The description is barely visible in the tan area below the timeline. You have to look closely to see that the text is being cut off. Let me know if you can't access the site for some reason.

thanks tdouty. looks like this is in Neatline Time plugin, not the Neatline exhibits plugin as is the case with the original poster's issue. Will look into this and get back to you.

Looks like this is only a problem with the Seasons theme. Can't replicate in any of the other Omeka themes. Still not sure what's causing it, but I'm inclined to say it's something you'd have to address in the theme itself, likely something in the CSS. I'll still poke around and see if I can find what might be causing the issue.

Thanks Jeremy.

Yeah, as I suspected, there are several rules in the theme's CSS that are causing this. Looks like its a few rules starting at like 528 in style.css, with selectors like #content > div. Removing the overflow:hidden; property:value combo helps some with your issue, but I'm not sure what the consequences of doing that are for the entire theme. There's also padding set in that rule, and in a rule on line 555 of that style sheet, that mess with the individual bands of the timeline.

Another option is to override those properties later in the file, using a rule specifically for Neatline Time divs. Something like this might work:

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

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

Basically using the nuclear option in CSS, to make sure the NeatlineTime container and its child divs don't have any padding. Also addressing the overflow visibility, so the timeline doesn't expand beyond its width. Not much inclined to address this in the plugin, since Seasons is the only theme that seems to have this issue.

I received this reply from the librarian who is populating the data:

"I changed the Seasons theme to Spring from Autumn and I also changed the theme to Berlin and all of the them have similar glitches when displaying the timeline. Berlin crops the top text and spring is the same as Autumn."

The variations in the Seasons theme (spring, autumn, etc) will likely have the same problem since they only change the color palette. Can't replicate this in Berlin, however. Do you know what version of that theme you're using? If you have a public page that uses Berlin and has this issue, send me that link too.

Berlin is version 2.0. I could upgrade this to 2.1 if you think that would help. I just switched the theme to Berlin at and I don't see the problem that she reports.

I think there might be a browser related issue. I changed the theme to Berlin on my MAC and probably had Safari open. The top was cropping the text. I do NOt see that however on the PC using Firefox in Berlin. The text on the timeline thought is missing the tops of some letters. However when I open up internet explorer the timeline events are all jumbled up overlapping.

sstatham, looks like there are quite a few pages with the same issue in Safari:




Wondering if there's something else wrong with that theme. The navigation is inside that main bordered box, instead of outside it at the top. Only seem to get this in Safari, too; looks fine in Chrome for Mac. Notice that I do not get this problem in Safari on my own installation. The problem might be caused by another plugin, or maybe someone's modified that theme? Upgrading to the 2.1 version of the theme might help too, but I'm not sure if thsi was a problem in 2.0.

We haven't modified the theme at all. I'll try to upgrade to 2.1 and let you know what happens.

I upgraded to 2.1 and it didn't help anything. I currently have it set to Thanks Roy.

You migth try deactivating plugins, one at a time, to see if the problem goes away. If it does, reactivate that plugin to see if the problem returns. If it does, it could be something in that plugin. I would add that I don't think NeatlineTime is causing it, because I have that activated locally and don't encounter that issue.

I have two semi-related follow-up questions to ask while this thread is hot :-) :
1) how hard would it be to customize the timeline to create a toggle that would allow it to pop up/collapse? Where would such a customization need to happen? In Neatline? or in the theme?
2) (I think the answer is no, but...) Is it possible to restrict the overall parameters of the timeline? E.g., my exhibit happened during over a set time period in the past... can I set the beginning and end date of the timeline to match those dates? (I know you can set the default date you want to appear upon loading...)

Hi Jen,

I think we inadvertently hijacked this thread, since you're talking about Neatline and not Neatline Time.

1. Not sure that it would be too difficult to do, if you're familiar enough with JavaScript/jQuery to implement it. If I were doing it, I"d write a separate .js file that does it. You'd need a button somewhere on the page to serve as the toggle switch. Then your JS would just do a simple show/hide of the timeline container. I'd put this in your theme, and load it separately. If I have time, I might tinker around and see how easy this is.

2. It's not currently possible in Neatline to do that. I'm not sure how possible that even is with SIMILE's timeline regardless of whether it's in Neatline. As far as I know, it doesn't have a way to set a start date and end date for the timeline display; It just displays dates based on the width of the timeline container and the space between intervals of time. I haven't looked thoroughly into this though, but if its at all possible, you'd need to consult SIMILE's codebase and docs first. If you do this, would love to know if you find anything!

Hi there--
I wanted to check in again about the misalignment of the timeline entries from a few weeks back (at the beginning of this thread)-- looks like David filed a ticket in Github, but I'm not sure what came out of that...

Hey Jen,

Sorry I haven't been able to get to this, I got swept off on other projects. I'll try to look at it today.


Same issue. I mistakenly posted as a new thread...copying to here.


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 ( making it very hard to read. I don't find anything in the Timeline .css to fix this.

NOTE: Since learning about the duplicate forum topic, I've implemented the suggested css fix to create a Neatline Time-specific div. Now my Timeline shows the gold month bar, but mostly hides the purple year bar.

Colleen Greene

Disregard my comment above. Jeremy is addressing it in the other forum post. Sorry for the confusion.