Images with text or lists within a grid - please help

Design help General
1

I come from a background with Adobe Muse, Dreamweaver, GoLive and other tools. I find placing text aside images very frustrating in Webflow especially when changing from Desktop to Mobile views. If anyone would be kind enough to look at the page I am working on, I would appreciate learning what is the best practice for doing this and how can I make this not take an hour to do such a simple grid.

Not convinced Webflow is really a good tool to move forward with larger content sites, it is so awkward and time consuming to do the simplest of tasks.

Here is my site Read-Only: Webflow - The Boot Shack
(how to share your site Read-Only link)

2

Hi at my iPad now can’t look at your link.
This is how I do it.
Crate a div as a wrapper make it flex
Insert the number of divs you need for your case
In each div add you text, image or what you need,

PS. Your inner divs can also be flex if you need it
I would use flex box all times before a grid

When going to a smaller viewport Chang the flex wrapper div to from horizontal to vertical

Here is a visual sample
https://www.1hus2man.se/how-to

3

I like the grid option as it allows me to change the number of columns from Desktop to mobile. After watching the Grid 2.0 instructional video I thought this was the “new way to do it”.

Question 1: So I have PNG images. They are not sized exactly to the layout, what is the best way to limit the size of their view?

Question 2: I created a DIV inside the grid to allow multiple items of text and graphics and the list. However the content often extended outside the DIV which puzzled me. I thought that the DIV container would keep the content inside the DIV when displayed?

Question 3: How the LIST text should be adjusted to move closer to the PNG Image? I can use a negative margin and then adjust it for each view, but this again seems so awkward like many Webflow controls. Is there a better way to keep the spacing or view spacing relative across Desktop, Mobile and Tablet views? I wish to have the LIST/text along side the PNG image. I am asking this trying to learn the best convention for Webflow. This seems to be a struggle for me in designs.

4

Thank you for looking at the link and the ideas. I duplicated the page, changed the grid to flex, but then I have no control over how many columns are displayed it is either four columns in one row, or one column in 4 rows if I select vertical. I may well be missing something on the best way to do this and would welcome any additional insights to help me learn this correctly.