Mobile Page design

rachelehly
Member

When I preview an website page in mobile and tablet mode, two of the images were right on top of each other with no words in between, unlike the rest of the page. 

 

Has anyone had to edit the design layout of the modules, beyond just moving the modules around?

 

 

 

 

0 Upvotes
6 Replies 6
roisinkirby
HubSpot Product Team

@rachelehly could you please share a link to the preview/live page are you working on? @ndwilliams3 do you have any tips to start @rachelehly off with optimizing her website for mobile?

0 Upvotes
rachelehly
Member

@roisinkirby, thank you for your response. 

The preview of the page is: http://us.thinkt3.com/courses-offerings/live-online-courses?hs_preview=r0KhQCT9-3123099008

 

 

Thank you @ndwilliams3 for any assistance. 

 

 

0 Upvotes
ndwilliams3
Key Advisor

The images and text are in separate rows, so when it moves to mobile the rows stack with the images in one section and the text in another. i'll mockup up an example in design manager and post shortly.

0 Upvotes
ndwilliams3
Key Advisor

Screen Shot 2018-06-01 at 11.44.02 AM.png

I'm guessing that the markup looks like the top section on the screenshot.

Needs to look like the bottom section. Image and text within a module group.

0 Upvotes
rachelehly
Member

Thank you @ndwilliams3. Can you explain in a bit more detail what I can do to fix this?

0 Upvotes
ndwilliams3
Key Advisor

Can you take a screenshot of the page template in Design Manager? It's tough to say without seeing the actual template.

0 Upvotes