Mobile/pc layout issue for images
-
Good morning
I have an annoying difference between the mobile version and the PC version to display my images correctly.
For example, on this page: https://voyages-ecoscien.com/atelier-lotus-siem-reap/
To clearly see the problem, I placed my 3 images with 2 different methods.
On the PC version, I would like my images to appear like the first 3 images, large, and not like the last 3, small:
But the mobile version is the opposite. They appear small on the 1st line, and large on the 2nd line:
For the first row, I created a layout grid, with a column inside, then an image gallery.
For the second line, it’s just an image gallery.
I tried to juggle the additional “alignfull” CSS classes without success.
Could you help me to render the first line on PC and the rendering of the second line on Mobile?
The blog I need help with is: (visible only to logged in users)
-
I’ve found !
I put a “Layout Grid” and then a “Gallery” in it.
The layout grid has the additional css class “alignfull column1-desktop-grid__span-10 column1-desktop-grid__start-2 column1-desktop-grid__row-1 column1-tablet-grid__span-8 column1-tablet-grid__row-1 column1- mobile-grid__span-4 column1-mobile-grid__row-1“.
-
Hey there,
Many thanks for reaching out!
The layout grid has the additional css class “alignfull column1-desktop-grid__span-10 column1-desktop-grid__start-2 column1-desktop-grid__row-1 column1-tablet-grid__span-8 column1-tablet-grid__row-1 column1- mobile-grid__span-4 column1-mobile-grid__row-1“.
It looks like you’re seeing extra padding there, which is the result of perhaps putting the column inside of the layout block.
Out of curiosity, what’s the layout you’re striving to create exactly? If you’re able to provide an example, or a link to what you’re looking to build we can perhaps provide next steps on how to achieve that.
Speak soon and looking forward to hearing from you!
- The topic ‘Mobile/pc layout issue for images’ is closed to new replies.
WordPress.com Forums 