Sidebar header dropdown shows two columns

After a recent update, the header dropdown version of the sidebar shows two columns on my instance (Minima theme). Doesn’t feel intentional.

Screenshot 2023-05-03 at 11.00.35


The extra column is intentional (per this commit), but I don’t think it’s supposed to be that narrow :thinking:

(cc @awesomerobot)


i’m going to be rolling the drop down sidebar out on our site in the coming weeks (we use the legacy hamburger menu still). and i like the two column view that makes it visually more like the legacy menu. is the column width accessible via CSS code?

The theme forced the old menu to a single-column, that doesn’t work well with the new menu, so I’ve removed it here:

Thanks for reporting it @tomtjes!

yes, the relevant CSS we’ve added is:

.hamburger-panel .revamped .sidebar-section-wrapper.sidebar-section ul {
  display: grid;
  grid-template-columns: 1fr 1fr; 

So to get it back to one column you could do this in a theme:

.hamburger-panel .revamped .sidebar-section-wrapper.sidebar-section ul {
  grid-template-columns: 1fr; 
  // you can also do something like `30% 70%` if you want to edit the column widths
  // or `1fr 1fr 1fr` if you want 3 even columns

Or if you want the entire menu wider (the columns will adjust automatically) you could do something like this:

.hamburger-panel .revamped  {
   width: 500px;

Perfect, thanks for the quick fix and additional instructions!


thank you for the detail @awesomerobot :slightly_smiling_face:


This topic was automatically closed after 4 days. New replies are no longer allowed.