Streaming live at 10am (PST)

Problem "GRID POSITION ELEMENT"

#1

Hi,
sorry for my English, I think there is a problem about the view “GRID POSITION ELEMENT”.

Maybe …
I’m working on a PC laptop 15’. Browser Google Chrome.


Here is my site Read-Only: LINK
(how to share your site Read-Only link)

2 Likes
#2

Hi @Grama -
If you are posting to the bugs category, please provide a read only link to your project.

I am trying to visualize your problem, but it would really help if can you further describe what you think your issue is. Example “When I do this, I can’t then do this”.

1 Like
#3

ok @webdev
i try

https://preview.webflow.com/preview/lovere?utm_source=lovere&preview=01457cdf9ec239fc5072eea997e1bf60

grazie!

1 Like
#4

I think the position option is missing.

#5

Okey, one way you can fix it is just dragging the link block to another cell and back again. See here > https://www.useloom.com/share/ad32015aa967434e9964ac5a1ae38f18

#6

@ webflow team - This is a bug.

CloudApp

It is not affecting other projects that I just tested and since @Grama @PiterDimitrov see it, it is present in the project.

1 Like
#7

If i click on IDRAULICI, IMBIANCHINI, MURATORI, RIPETIZIONI, GIARDINIERI it’s ok, i can see “Position” and I can change the value on Column start/end - Row start/end.

But if i click on BABY SITTER, BADANTI, ELETTRICISTI, FALEGNAMI, i can’t see it; there is the option “EDIT PARENT GRID” OVER the option “ POSITION”, so I can’t click on it.

Anyway, I don’t know if it’s just my problem, but thank you all for your help.

#8

@grama - The webflow team is looking into this problem. I / they will update it here. Thanks for being patient.

#9

No problem. Thank you :slight_smile:

#10

Hi Grama, I’m one of the core engineers currently working on grid. Thanks for the report, and thank you for the preview link! That helped me narrow down where and why this problem is happening. It is definitely not something you’re doing incorrectly.

The reason why this is happening boils down to a CSS grid concept — if given no positioning values, the browser will auto-place grid items inside of the grid container by default. This means that the grid item will end up flowing inside of the grid, filling up the next available cell(s). For example if you inspect the BABY SITTER button, you can see it does not have any positioning values:

No positioning values:
image
With manual positioning values:
image

Webflow’s current feature set for Grid doesn’t support grid items that are auto-placed (only manual positions), which is why the UI looks off. Normally in Webflow, these grid items should all have manual positions, but it’s possible to get into this problem state via the following repro steps:

  1. Add a div element, give it a class.
  2. Add a few child elements inside of the div.
  3. Clone the page (or go to a different page and set the same class on another element with children).
  4. Go back to the original page, and change the display into grid.
  5. The grid items in the original page shows the position inputs.
  6. The grid items in the different page shows the bug you’re reporting.

From an engineering perspective, it turns out to be incredibly tricky to position every single grid item inside the same parent of this class across the entire site. For now, I recommend the fix that @PiterDimitrovs recommended — drag and drop the element back into the cell and it should apply the manual position.

We’re also going to be shipping a small update to the UI to address this problem within the next couple of days. This update should help make the experience less jarring and will provide a clearer path towards fixing the problematic grid items.

Also, I’ll spare you from the implementation details that led to this bug, but I’ll just say that we’re going to be shipping more grid features soon that will make this issue go away.

4 Likes
#11

Hi again — just wanted to follow up from my previous post.

Moving forward, should you come across this issue again this UI will appear:

image

Simply click place the item and the selected element will be manually positioned in the grid where it is currently rendered on the canvas. I know it can potentially become tedious, but rest assured this situation will become a non-issue with our next enhancement.

Thanks again!
Tai

3 Likes
closed #12

This topic was automatically closed 60 days after the last reply. New replies are no longer allowed.