Is there a way to force all grid contents to be uniform in size? They’re all the same size on desktop, but on mobile, they adjust inconsistently. I’d prefer them to stay the same size. Any suggestions?
I managed to do it using code, as shown in this picture. However, I’d like to learn how to achieve this using Blocs. I’m determined to master Blocs, which is why I’m asking these questions—I want to avoid solving everything with code.
Does this video help do what you desire? Or Width and Gap in the documentation ?
1 Like
If that’s the only way to work with CSS Grid, then it seems aligning everything into two columns and two rows as I want isn’t possible. Based on Rapidweaver’s logic, the best approach would be to use two 2x Column Rows, one above the other, and place the buttons accordingly. The video confirmed that my method was correct, and achieving fixed widths isn’t feasible the way I intended. Thanks for the video—I was going crazy trying to figure out why it wasn’t working with the settings!
^ That statement could perhaps be generalized for Blocs CSS Grid ? 
Have you tried Pinegrow yet regarding it’s CSS Grid Editor ?
I wasn’t saying there is not a better approach, proper method, or definitive way. I was just passing through and trying to point to some obvious related things. @PeteSharp, @Eldar or someone else may know more conclusively concerning the potential and methods of Blocs CSS Grid abilities. Or @Norm may likewise chime in.
_User == _Observer 
Not yet. The page feels off to me. If this is the best they can do with their app, I’m not impressed. It looks cluttered, with too much information, which ends up confusing me. The payment page is strange too—it’s hard to tell what the best option is, almost like they’re trying to be sneaky. The UI isn’t my style; it reminds me of a Linux distro. Honestly, I’m hesitant to try it out.
1 Like
I couldn’t replicate this. I just added a css-grid. Then added a label bric into each div inside the grid. Edited label text and then added a class to each div to colour the background. I manually resized the grid to cover most of the page on the largest break point. When i changed breakpoints it just worked for me.
P.s you can also manipulate a css grid by adding a class to it and then use the css grid tab inside the class. You can add rows, create gaps, etc there. Use key words like span, to span a row or column over the grid.
1 Like
Yep, everything concerning the CSS Grid in Blocs in covered on the documentation page linked above, including the Class Editor features towards the bottom of that page.
1 Like
I was able to achieve what I needed using two 2x Column Rows, and it works perfectly. I went through the grid tutorial and read the documentation, but they didn’t address my specific issue. The content was being pulled randomly, but it only happened on the iPhone 13 and 14. When I tested on the iPhone 15 or iPhone 13 Pro/Max, everything worked fine.
I used Safari in developer mode and pinpointed the screen size that triggers the issue, but I’m not going to spend more time trying to fix it right now. The page has already been delivered.
1 Like