Navigation and Footer alignment in purchased template

Highlighted
Regular Contributor

Hello,

 

I am having some issues with the alignment of my navigation and footer.

 

This is the page in question and this is how it should look (centered).

 

Any help would be greatly appreciated.

 

Thanks,

 

Jamila

Reply
0 Upvotes
7 Replies
New Contributor

For the header, i think you just need to modify this css:

.header-container .page-center {
    max-width: 1150px !important;
}

to include:

.header-container .page-center {
    max-width: 1150px !important;
    margin: 0 auto!important;
    float: none;
}

and for the footer, it looks like you have a bunch of divs nested inside each other with the class of .footer-container . You may want to look into that. However,  your inner-most nested .footer-container has inline styling of width970px;. You should be able to add the margin and float properties to that as well.

Reply
0 Upvotes
Regular Advisor

Hey @Jlawal,

 

Your page center styling disappeared.  I know you had it before, maybe you need to switch to an older revision of your css?

 

@jestlinbaum,  hubspot's css sets a float and a left margin on it column wrappers. margin: 0 auto !important; won't reset the margin-left: 0 !important; that is set by Hubspot. What I always do is:

page-center {
    float: none !important;
    margin-left: auto !important;
    margin: 0 auto;
}

that ensure that the float is overwritten and also the margin left. 

Reply
0 Upvotes
New Contributor

@Jsum,

Noted. Thank You!

Reply
0 Upvotes
Regular Contributor

Hi @Jsum

 

Thank you for replying! I have two stylesheets attached to this page:

The 1st is the templates stylesheet and the 2nd one is the header and footer styling taken from our websites main stylesheet. Is it the 2nd one that needs the page-styling or has it been removed from the 1st stylesheet?

 

Many thanks,

 

Jamila

 

Reply
0 Upvotes
Regular Advisor

@Jlawal,

 

The page is looking right now so you must have done something to fix it. 

 

When I went to the page before, used the inspector, and chose the page center wrapper around the header, and then the footer, there were no styles set to center it. I couldn't really say if or why the stylesheets were not applying the code to the wrapper around your header and footer. It looks like it is working now though. Smiley Happy

Reply
0 Upvotes
Regular Contributor

@Jsum

 

You're right! I wish i could take credit for it but i don't think it was me!

 

The fairies must have done it haha.

 

Thank you again - your input is always appreciated!

Reply
0 Upvotes
Regular Advisor

Anytime!

Reply
0 Upvotes