Background Not Responding on New Landing Page Design

Highlighted
Level 2

Background Not Responding on New Landing Page Design

Hey Marketo Community.

We recently redesigned our website, and our dev agency gave us new HTML & CSS code for our Marketo Landing Pages. I built the page, but unfortunately the LP responds incorrectly when compared to our main site. It looks like the white background is a set height, and does not respond one way or the other while the body copy overflows.

Attached is the HTML file I'm using for the template. Also attached is a screen grab of the overflow text. 

Test LP link: Landing Page | Panasonic Industrial Devices 

Homepage (with new design>: https://na.industrial.panasonic.com/ 


Any and all help would be awesome. Thank you!
Steve 

EDIT - Here's the overflow image

overflow.png

#html css for marketo

4 REPLIES 4
Highlighted
Level 10 - Community Moderator

Re: Background Not Responding on New Landing Page Design

Please remove any image attachments and paste them inline into the thread (in the editor box). Not all Nation users can view attachments, which creates immediate confusion.

I'm confused about why the agency that gave you the code wouldn't be the first stop here? Marketo LPs (assuming you're using a Guided LP template) can be created from scratch using the agency's HTML & CSS, which they should've already tested.

Highlighted
Level 2

Re: Background Not Responding on New Landing Page Design

Thanks for the heads up re: inline images, Sanford. Agency isn't first stop because project $$ are up. 

Highlighted
Level 1

Re: Background Not Responding on New Landing Page Design

It looks like you have a div with the id=mktContent that has a height of 1000px. Using my browser dev tools, I removed the height on that. Right below that the #lpeCDiv_13037 div is position: absolute. I changed that to position: relative.  I also removed the rest of the styles for #lpeCDiv_13037. You'll need to add in styles for your content container and paragraphs. This made the page and footer act normally without overflowing on to the footer.

Highlighted
Level 2

Re: Background Not Responding on New Landing Page Design

Thanks for this, Daniel. 

What I find really tricky is that mktContent div has NO set height in the template. While creating a landing page with the template, it's like Marketo forces you to set a height, which makes no sense. Is there a way to not set a height? I try setting it as auto, or delete the values, and it acts strangely. Here's a quick video of me tooling around:  May 10, 2019 4:18 PM.webm - Google Drive 

Re: #lpeCDiv_13037 div, that div is created when I add elements on top of the landing page template. I did exactly what you did to get the page to respond properly, but that div only appears after I add content. If that DIV name stays exactly the same, I'd set a CSS rule to have the position as relative. Do you know if the lpeCDiv_13037 div is consistent throughout Marketo LPs? 

Cheers, 

Steve