Streaming live at 10am (PST)

Grid issue with CSS rendering


#1

I think I’m probably one of many who will be bringing this to the attention of the webflow staff.

But it seems like at times when new code is pushed to the Webflow servers, it sometimes breaks the new GRID code functionality on our pages.

I pushed one small image update today, and voila, footer broken. Not only that but it seems to also mess up two totally unrelated other things. One changed one grid object’s interaction to the next one down the side bar list, when I fixed it, it seems to then move to the next one and do the same thing with changing up the to the next possible option in the interaction list… totally weird and gremlin like.
Another bug is webflow is adding words outside a button, but the same words inside the button so it read twice.

Here’s my site and attached screenshots of what the footer looked like before and how it’s all messed up in the editor and viewers screen.
https://www.highviewpartners.ca [ look at footer ]


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


Creating Symbol changes content in Header
#2

I’m having the same issue with Grid today 24 Oct 18. I worked on and published test site yesterday and all was OK. http://wj-project-services.webflow.io/

Today in Webflow the grid layout is all misaligned in all breakpoints.
Like LvnLife - this is in a footer also.

In the navigator, the content is shown correctly inside the divs, but on the canvas the content appears outside of the divs and in a different Grid cell.

Screenshot


#3

Same issue! Was about to launch the website… Hope they fix it soon.


#5

Hi @Dimo_Trifonov @RugbyWebDesign @LvnLife

Thanks for posting about this weird grid behavior — definitely looks like a regression of some kind.

I’ve filed a report with the team and we’ll look into this to find a solution.

For now it looks like the error is caused when the grid is inside of a symbol. This definitely shouldn’t be happening though.

To fix this, can you please temporarily unlink the symbol? I’ll post back here when we have a fix :bowing_man:


#6

Bingo! As soon as symbol unlocked, the grid returned to expected behaviour.


#7

Same for me. Here is a site that repros: https://preview.webflow.com/preview/ideal-mri?utm_source=ideal-mri&preview=abed5612cd71c7b396f16533971153c2

On the home page, I unlinked the symbol so all good. On the other pages, you can see the symbol is corrupted.


#8

Solution: Unlink / Break the symbol apart, and it should work fine.

They are looking into a solution.


#9

Hi,
i created a header section using grid, i placed in a Logo, some links and a Navbar! When i select the section and create a Symbol the whole leayout inside the section changes mirroring all the elements to the right, and the navbar becomes unresponsive when trying to readjust to its orginal size inside the grid. Can anyone Help?

46 04


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


#10

Did you find a solution to this dude?

I had the same problem with a footer today.

I created a footer symbol a few days ago and it was fine. But today I noticed the layout was messed up. So I unlinked it from the symbol, deleted the old symbol, and repositioned the elements again in the footer.

When I turn this in to a symbol it moves some elements around again. :crazy_face: Haven’t got a clue why!


#11

Hey Guys,

i also have problems with my header and footer today. I think there’s some kind of bug with the grid in it cause rows and columns behave really strange …


#12

Fingers crossed it will be fixed soon Sonja :grinning:


#13

Hi @Esteban @Sonja_Jung @Juval_Kuerzi

I went ahead and merged your posts to this existing thread.

It looks like there’s an issue with grid inside of symbols. Unlinking the symbol will fix this for now.

But we have an update — the team was able to find a fix and it’s currently going through some QA.

We should be able to deploy the fix soon and I’ll keep you updated :slight_smile:


#14

Hi @LvnLife @RugbyWebDesign @Dimo_Trifonov @bherila @Juval_Kuerzi @Esteban @Sonja_Jung

​Thank you again to each of you for posting out about the Symbol+Grid issue.

​I wanted to let you know the fix our team created for this issue is ready to go and should be fully deployed later today.

Can you please check to see if this is resolved on your end in the next few hours? If you still see the behavior by tomorrow morning, please let us know and we’d be happy to investigate further. :bowing_man:


#15

Awesome! Thank you for the swift reply and fix.


#16

Thanks a lot for your really fast support @Brando,

i still have an issue with the tablet breakpoint. There seems to be some columns i don‘t need in this breakpoint and i don’t know why … but I’m trying to figure out what the problem is, maybe it’s just a small mistake of my own :smiley:


read-only Link: https://preview.webflow.com/preview/mundart-sirup?utm_source=mundart-sirup&preview=c387444a6d07f9a730b0738c8122147b


#17

What you may want to look into, is at this stage on mobile viewport is converting this grid into a flexbox, and then stack vertically. That is what my developer told me to look into.

Not too sure how extensive your grid is, but you may want to look into this.

These videos helped me get a better understanding of what I can do also.



#goodLuck :slight_smile:

#18

Hi @LvnLife,

thanks for your advice. I tried to turn it into flexbox and yes, it worked BUT this ist not what grids a for i think. On thing i didn’t get is: for Lanscape the grid works how it should … I won’t give up to fix it in tablet. May i will found the problem :slight_smile:


#19

working great, thanks for quick support!


#20

Hi @Sonja_Jung

I still have an issue with the tablet breakpoint.

This sounds like it could be caused by the same culprit mentioned here:

Can you check if you have elements on non-existent tracks?