Canvas Support

Boxed Layout Problem

4 replies · opened Jan 5, 2018

HHRJan 5, 2018

Hi Canvas,

I would like to use boxed layout in my project but when I did, the topbar and the menu won't be in the boxed layout. How to deal with this?

Thank you.

SSemicolon WebSTAFFJan 5, 2018

Hello,

The Sticky Header is Full Width by default. However, you can add the following CSS code to make it Boxed Width: 

body.device-lg:not(.stretched) #header.sticky-header #header-wrap {
    width: 1220px;
    left: 50%;
    margin-left: -610px;
}

body.device-md:not(.stretched) #header.sticky-header #header-wrap {
    width: 1000px;
    left: 50%;
    margin-left: -500px;
}

This will definitely work fine. Hope this Helps!

Let us know if we can help you with anything else or if you find any further issues.

HHRJan 8, 2018

Thank You Canvas. The code works fine for the header. However, how to do with the topbar?

Regards,
HR

SSemicolon WebSTAFFJan 8, 2018

Hello,

You can consider using this Code

body.device-lg:not(.stretched) #header.sticky-header #header-wrap,
body.device-lg:not(.stretched) #top-bar {
    width: 1220px;
    left: 50%;
    margin-left: -610px;
}

body.device-md:not(.stretched) #header.sticky-header #header-wrap,
body.device-md:not(.stretched) #top-bar {
    width: 1000px;
    left: 50%;
    margin-left: -500px;
}

Hope this Helps!

Let us know if we can help you with anything else or if you find any further issues.

HHRJan 9, 2018

Thank You Canvas. It's Works perfectly.

Have the same question, or something new?

Sign in to the Canvas dashboard to reply or open your own topic. Canvas owners get direct help from the SemiColonWeb team.

Reply on the dashboard