בעיית פריסת רשת עמודות קונטיינר?

סיכום מבוסס בינה מלאכותית

A user, Don, reports a grid layout issue on mobile devices, specifically when the topic-progress-wrapper is docked. The problem arises from a media query that applies a single-column layout on screens smaller than 924px, which disrupts the layout when the progress bar is docked. awesomerobot initially thought the issue was resolved but confirmed it persists when the progress bar is docked. A fix has been proposed in a GitHub pull request 16444, which addresses the layout issue when the progress bar is docked.

Hello,

I notice an issue on mobile view on tablet device.

This media query works well on mobile but I think it should active on all mobile view width.

@media screen and (max-width: 924px) {
  .container.posts {
    grid-template-areas: "posts";
    grid-template-columns: auto;
  }
}

Over 924px it will add the timeline to the template-areas which is (i think only appear on desktop) on mobile broke the layout.

.container.posts {
  display: grid;
  grid-template-areas: "posts timeline";
  grid-template-columns: auto auto;
  margin-bottom: var(--below-topic-margin);
}

Thanks :slightly_smiling_face:

2 לייקים

@Don I’ve done a little testing and I don’t believe this is a problem anymore… have you seen it crop up at all lately?

לייק 1

Thanks for checking it @awesomerobot.

But I think this is still a problem. It is only appear I think if the topic-progress-wrapper docked.

לייק 1

Ah I see, I think I was looking at the wrong thing. This should fix the layout when the progress bar is docked:

2 לייקים

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