Section 2 of Marketo Landing Pg Template that includes the form

[Christine_LeBla]

Hi,

I have selected my form, but it is positioned to the right of section 2. However, Another part of section 2 is a text block that is left alignment. I would like my form centered, but if I eliminate the text block in section 2, my form still remains right aligned.

I cannot hide section 2 as the form is built into that section.

I have not had this issue before and the code is matching other templates I've worked with before, so unsure what I can do within the program set up to resolve without affecting the base, master template?

Thank you.

[Disha_Goyal6]

Hi @Christine_LeBla, please share the link of LP where you are facing this issue.

[NiharikaGoyal]

Hi @Christine_LeBla 

Hope you are doing well.

To fix this issue, we need to implement separate hide/show functionality for the left text block. When the text section is hidden, the form will automatically center itself. This requires some updates at the template level, including the creation of new variables. It would be helpful if you could share the landing page web URL so I can able to check.

Thanks!!

[Dave_Roberts]

You'll likely need some CSS to hide the text block in Section 2 and then maybe a little extra to center your form block. 

This can be done "for one page only" without needing to update the template using the Edit Page Metatags menu and adding a <style> tag into the Custom HEAD HTML input in case you were looking to just make a change to this page without modifying your template and needing to reapprove all the landing pages hanging on that template. 

Please approve the LP you're working on and send the "View Approved Page" link here in the community so folks can help you troubleshoot this issue.

[Christine_LeBla]

form is nested in section 2 by default

[NiharikaGoyal]

Hi @Christine_LeBla Please share the Web URL of page to check the section.

Thanks!!

[SanfordWhiteman]

@Christine_LeBla please supply the requested link for the other participants in this thread.

[Christine_LeBla]

I've got the solution. Anyone can take note of it! You can do this without having to remove or modify code, or shift things around in the master template for your LP.

Remember, the form is nested within #section2 id. - You can target just that instance like this in that 'Edit Page Meta Tags' within your program's LP. And, apply this code so the form can span from edge to edge of the screen in desktop view.

<style>
#section2 .col-md-5.col-md-offset-1 {
width: 100% !important;
margin-left: 0 !important;
flex: 0 0 100% !important;
max-width: 100% !important;
}
</style>