Frontpage double layout: the recent posts list doesn't show on the right column but below the categories column

(metacortex) #1

Thank you for this beautiful software that is Discourse.

Here is the bug:

Frontpage double layout: the recent posts list doesn’t show on the right column but below the categories columns (instead of having the two columns of the frontpage nicely one next to the other: categories | recent)

  • At the beginning of use of the forum it was fine, the two columns always showed side-by-side. But then it changed.
  • Happens on main browsers.
  • Happens after creation of certain new posts, but not always.
  • I tried to delete some categories and posts (that might be too “long”?), but still shows broken before log out.
  • Don’t happen when not logged in after the deletion of certain posts and categories.
  • When “logo image” too long, the bug also happens (and that is normal I guess), but now even when they have short length it still happens.

What would be a trick for making sure that the two columns always nicely show side to side on main front page? Or what did I do wrong? Thanks for your insight.

edit: using 1.7.0.beta9, no additional plugins, no changes in vanilla code, no tweaks.
edit: upgraded to 1.7.0.beta10(or latest?): bug still bugging.

edit: I Remembered I saw this bug on one of the websites you showcased on your blog:
my forum has exactly this problem with main layout (using mozilla, chrome):

(Jeff Atwood) #2

Aha this is a bug @eviltrout.

(Robin Ward) #3

How do I reproduce this? I saw on Meta we were set to categories only, but I checked the other two layouts and they look OK.

The dexter site listed above looks like it has quite a lot of CSS customizations which change the size of things, and I suspect that is pushing the column out.

(metacortex) #4

I might have identified --but maybe it is caused by other elements?-- when this bug only happens on my system (which is not the way it might be happening on the dexter website): with the default @ install Discourse French translation, the horizontal menu bar above the categories/topics, when there are new topics and the “Nouveaux”(“New” in eng), changes to “Nouveaux(n)” (“n” being the number of new topics), then the whole “recent topics” block is pushed under the categories block. --there is not any CSS or code change on my system of Discourse, w/ latest version–

Before / after pics:

(metacortex) #5


(metacortex) #6

Here is another view of the bottom, where you can see there the “Nouveau 1” notification in the right corner of the last category, that might also be causing the bug:

image 3 :

(metacortex) #7

Seems definitely caused by the notification of “x nouveau” that appears in bottom-right corner of a category: when “Nouveaux” tab in top horizontal menu already deactivated from the parameters: only when all those notif gone is the recent posts block coming back on the right of left column.

Now how to solve this. todo Trying edit(shorten) the word “nouveau” and see behavior.

//// todo (me): change in english and other languages and see if that happens too (if that happens then the problem is not just the french language pack but my “kind of”/my setup).

/// todo (me) OFF-TOPIC side question to search: how to make the top horizontal menu counter of “New” button/tab go back to zero by e.g. just clicking on the tab (accessing the “New” tab page), rather than having to click all new subjects individually / also logout login doesn’t reset the counter.

(Jeff Atwood) #8

Looks like this is caused by extremely long category names. There is a reason the helper text says “1 or 2 words” for category names…

(Rafael dos Santos Silva) #9

Category images are too big, either reduce then or set a custom CSS to make the layout fit:

.category-logo {
    max-width: 445px;

(Mittineague) #10

Maybe doing similar to the what’s done with longer category names in the hamburger menu? i.e.

overflow: hidden;
text-overflow: ellipses;

I’m not sure how good it would be to have “nouve…”, but it might be good enough.

(Rafael dos Santos Silva) #11

In this case the problem are the images.

(Simon Cossar) #12

Maybe the default css for .category-logo should set the maximum width instead of the maximum height. As it is now, any long image will break the layout.