Mobile Landing Page - moment of resize | Community
Skip to main content
J
Community Advisor
JDNelson1Community Advisor
Community Advisor
January 28, 2015
Solved

Mobile Landing Page - moment of resize

  • January 28, 2015
  • 4 replies
  • 2491 views
I'm using the new mobile landing page release and I love it.  I am using the functionality to change my landing page banner to a mobile-friendly version (shorter & narrower design) and it's awesome on a mobile device.  However, I then noticed that when I re-size my desktop window the banner changes to the mobile version somewhere around 1000px and appears to be about 50% of the 480px banner size.  As I continue to re-size the window smaller and get to the 480px width, the rest of the page re-renders and the banner graphic is then full size and looks great.  I'm curious if the page renders on a smaller monitor (~1000px) if they'll have a poor experience; or better yet, if there's a way to fix this?

Anyone else seeing this issue?
This post is no longer active and is closed to new replies. Need help? Start a new post to ask your question.
Best answer by Edward_Unthank_
The problem code is on line 267: img {max-width: 100%;}. I can't tell if it's custom code that's been there before or if it's with the new release—my guess is it's old code. The breakpoint it's focusing is on 768px, which is why it looks like it jumps twice. 

When I removed that line, the mobile version and in-betweens look great!

Check in your landing page template and landing page editor to see if it's residual code from before. If it's not on your end, it might be a bug that Marketo can squash. (You can CTRL+F "img {max-width: 100%;}" to see if it's in the template.)

Edward Unthank | Founder, Etumos

4 replies

Edward_Unthank_
Edward_Unthank_
Level 7
January 28, 2015
Curious! Do you have a link to the landing page to check out the source code?
J
Community Advisor
JDNelson1Community AdvisorAuthor
Community Advisor
January 28, 2015
Here's a stripped version:
http://info.liveperson.com/mobile_testing.html

 
Edward_Unthank_
Edward_Unthank_Accepted solution
Level 7
January 28, 2015
The problem code is on line 267: img {max-width: 100%;}. I can't tell if it's custom code that's been there before or if it's with the new release—my guess is it's old code. The breakpoint it's focusing is on 768px, which is why it looks like it jumps twice. 

When I removed that line, the mobile version and in-betweens look great!

Check in your landing page template and landing page editor to see if it's residual code from before. If it's not on your end, it might be a bug that Marketo can squash. (You can CTRL+F "img {max-width: 100%;}" to see if it's in the template.)

Edward Unthank | Founder, Etumos
    J
    Community Advisor
    JDNelson1Community AdvisorAuthor
    Community Advisor
    January 28, 2015
    Appears we have quite a bit of old code on our templates... most of which doesn't even do anything... that part, though, DID.  Thank you!
    Terms & ConditionsAccessibility statement

    Loading footer...