Support » Theme: SuperMag » how to change width of the entire template

  • Resolved bksubba

    (@bksubba)


    Could you help me out on how to change the width of the boxed layout. I want it to have some padding on the left and right so that I can have floating media buttons etc. It is working fine right now on a big screen(above 15 inches) but when I try to load the website on a small laptop screen such as 12,13 or 14 inches, the width covers the whole screen. I want it to have some right and left padding even on smaller screen laptops

Viewing 4 replies - 1 through 4 (of 4 total)
  • Hello @bksubba ,

    You can try following css on Appearance => Customize => Additional CSS

    .boxed-layout #page {
      max-width: 90%;
    }
    .wrapper {
        max-width: 90%;
    }
    .slider-section {
        max-width: 55%;
    }
    .besides-slider {
        max-width: 45%;
    }

    Best Regards!

    Thanks @codersantosh. It worked fine, however, paddings are not looking nice on a smaller screen such as mobile devices. Is there a way I can enable these paddings only on big screens and disable it on smaller screens such as mobile devices etc

    @bksubba you can delete previous css and add folllowing:

    /* for screen size more than 768px wide*/

    @media screen and (min-width: 768px) {
    .boxed-layout #page {
      max-width: 90%;
    }
    .wrapper {
        max-width: 90%;
    }
    .slider-section {
        max-width: 55%;
    }
    .besides-slider {
        max-width: 45%;
    }
    }

    Best Regards!

    Works like a charm…Thanks @codersantosh …. appreciate it

Viewing 4 replies - 1 through 4 (of 4 total)
  • You must be logged in to reply to this topic.