Docs

[Brownstone303]

Hello, I’m trying to get my header, navigation bar and footer to be the same width as my content. I have sized all of my revolution sliders to be 1250 pixels in width and thought the frame of my site was set that way also, however as you can see the header/footer are wider than the content. Please help me make it all consistent. See jpeg of how site should look. I will also need to tweak space between sliders as the gap seems larger than I’d like. I tried to modify in Cornerstone, but it didn’t help.

Also, please help me fix my footer so my facebook icon comes up and I have white text instead of the default body copy color. I attached a screen grab of how I want it to look.

http://f51.23a.myftpupload.com/

Thank you!

[Joao]

Hi There,

Would like to have your site boxed(“squeezed on the middle”) or fullwidth where your fill up the screen like on the screen attached?

Provide us more details.

Also would you mind providing us with login credentials so we can take a closer look? To do this, you can make a post with the following info:

– Link to your site
– WordPress Admin username / password

Don’t forget to select Set as private reply. This ensures your information is only visible to our staff.

Thanks

Joao

[Brownstone303]

This reply has been marked as private.

[Jade]

Hi Ed,

Please try to add this to the CSS customizer:

.x-slider-container {
    max-width: 665px !important;
    margin: 0 auto;
}

.tp-revslider-mainul {
    width: 100% !important;
}

#rev_slider_1_1_wrapper {
    height: 115px !important;
}

.masthead, .x-colophon.top {
    width: 665px;
    margin: 0 auto;
}

Hope this helps.

[Brownstone303]

This reply has been marked as private.

[Rad]

Hi there,

You mean set the navbar and slider’s width the same as content width? The content which is narrower than navigation and slide has its own inner container. The inner container is based on the percentage which means, navbar and slider will never be the same as the content width. Unless, force it but that contradicts the responsiveness.

What you could do is edit your section’s row and disable Column Container, you can do that by inspecting each row. Then, choose Blank – No Container | Header, Footer template for that page instead of Blank – Container | Header, Footer

Then on your customizer’s layout section, choose the max width to 526 since it’s the width of your current content. Now that there are no containers, setting max-width in customizer will be applied evenly on all section, navbar, and slider.

About the footer, the first text widget has malformed content that breaks the footer layout.

<a href="https://www.facebook.com/Quail-Summit-Senior-Community-355675094637466/?fref=ts/"><i class="x-icon-facebook-square"> </i></a>

<a class="social-icons-footer" href"LINK"

Please change it to this,

<a href="https://www.facebook.com/Quail-Summit-Senior-Community-355675094637466/?fref=ts/"><i class="x-icon" data-x-icon="&#xf082;"></i></a>

Hope these helps.

[Brownstone303]

Thank you. The footer suggestion helped however I would like to change the link color from light blue and make it white. Please see this example http://www.ateretavot.com. I would love the footer to be the same with the text and icon closer together.

Thank you!

[Nabeel A]

Hi again,

Please add the following code in your Customizer:

footer.x-colophon.top {
    color: #fff !important;
}
footer i.x-icon:before {
    font-size: 45px !important;
    color: #fff !important;
}
#text-3 .textwidget {
    text-align: center !important;
}

Let us know how this goes!

[Brownstone303]

Didn’t work 🙁

It’s strange that I was able to do it for the site I linked above.

Links white and facebook icon larger.

[John Ezra]

Hi there,

Thanks for updating the thread! The provided CSS are the correct ones to achieve what you want. You may have something conflicting or possibly some syntax error. Would you mind testing for that? Please put the CSS provided above all other CSS in your custom CSS Section in the customizer. If it works, then you may have a missing “)” closing curly bracket or an unclosed single or double quotes or reformatted quotes that are causing an error.

If it still doesn’t work, then we have another issue, possibly a plugin conflict, please test for that by deactivating non X plugins.

It could also just be a caching issue, where you would just need to clear your site cache.

Let us know how that goes. Hope this helps – thanks!

[Author]

Posts