Required CSS layout tweaks for new vertical timeline in 1.6?


#1

It looks really messy with larger width forums:

Haven’t figured out how to fix it in the CSS yet, but just be warned if you are upgrading.


Change right gutter to vertical timeline + topic controls
Change right gutter to vertical timeline + topic controls
(Jeff Wong) #2

Is that a screensize issue, or something to do with a custom CSS? You can probably bank that all sites’ custom CSS is probably going to have to change to incorporate the timeline once it’s released to the wild…


#3
.timeline-container {
    margin-left: 757px;
}

Resize the margin with something bigger, and that should do it


#4

Thanks, just figured it out myself. Set it to 180px and it is fine now.


(Tobias Eigen) #5

w00t! excited to see this on my site. Nice work. :rocket:

I have a custom menu across the top - this causes the top of the vertical nav to be pushed down by the same amount. Is there a recommended css customization to move it back up so it aligns with the top of the first post like it does here on meta?


(Martial) #6

Arff with another language than english I have this


Should "Reply" appear in the right gutter?
(Gerhard Schlager) #7

Should be quite easy to fix.

.timeline-container .topic-timeline {
    margin-left: 3em;
    min-width: 150px;
    width: 100%;
}

@codinghorror expressed some concern, but I tested it on a few devices and it looks fine to me.


(Jeff Atwood) #8

This is the actual size:

So yes, 150px width is safe, but anything more (even 20px more) would impact iPad.