Re: Landing Page Help: Full Width Image

Anonymous
Not applicable

Landing Page Help: Full Width Image

Hi,

I need to make a few images on my landing page 100% width of the page. Tried some basic HTML but didnt work. Anyone have any better ideas or can send some code that accomplishes this?

Thank you
Tags (1)
6 REPLIES 6
Anonymous
Not applicable

Re: Landing Page Help: Full Width Image

Tim,
Are you looking for something like this: http://mhsinfo.mckesson.com/PI_Webinar_Series_Registration_2013.html? Or do you really mean 100% of the page?

For us, our template includes a <div> that only goes a particular width. If you literally wanted it to span the full width of the page, I'd imagine you'd have to create a new template. This Webinar totally ROCKED and should be able to help you if you need to create a new template: https://community.marketo.com/MarketoArticle?id=kA050000000L5L3CAK.

I hope that helps!

~Jaime

Anonymous
Not applicable

Re: Landing Page Help: Full Width Image

Anyone know where that original webinar landed?  With the new community, I keep getting redirected to the main product docs page.

Anonymous
Not applicable

Re: Landing Page Help: Full Width Image

It is defined by CSS in the landing page template or custom HTML.

In a very simplified overview the CSS would have:

 
background-image: url(your_image.jpg);
background-repeat: no-repeat;
background-position: center center;
background-attachment: fixed;
 

Add the browser prefixed CSS first:
 
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
 

Then add the CSS property:
 
background-size: cover;

I did not test yet. It may need few adjustments though.
Anonymous
Not applicable

Re: Landing Page Help: Full Width Image

Thank you both for your responses. Seems i'll just dive into the webinar and see what i can pull out of it. I'm not fully educated in the CSS world and Marketo so it seems i may be a bit stuck here without outside design help. 

Wish it was easier to work within the LP builder...something like wordpress where we could atleast edit certain aspects of the HTML would be amazing. 
Anonymous
Not applicable

Re: Landing Page Help: Full Width Image

Tim,
Watch the whole webinar. It actually is probably very good for those who don't have much experience. I was able to skip some since I know design but I think it should help you a LOT! Let me know if you have questions and if I have time I can help!
~Jaime
Anonymous
Not applicable

Re: Landing Page Help: Full Width Image

Very helpful Jamie, thank you.