300px Wide Sidebar Layouts

Featured Theme Forums Twenty Plus Pro Twenty plus Pro Guides 300px Wide Sidebar Layouts

This topic contains 0 replies, has 1 voice, and was last updated by  Zeaks 2 years, 4 months ago.

Viewing 1 post (of 1 total)
  • Author
    Posts
  • #13374

    Zeaks
    Participant

    These extra wide sidebar layouts are good for anyone wanting to include larger AdSense ads in their sidebars.

    To use these, select the layout in theme options you want to use (left or right sidebar) then copy and paste the related code into the custom CSS area in theme options.

    Code:
    300px Wide Right sidebar layout

    /* ===[ 300px Right Sidebar Layout ]=== */
    @media screen and (min-width: 600px) {
    .right-sidebar.custom-layout .site-content {
    float: left;
    width: 61.1042%;
    }
    .right-sidebar.custom-layout .widget-area {
    clear: right;
    float: right;
    width: 30.0417%;
    }
    .right-sidebar.custom-layout #extra-sidebar {
    clear: right;
    float: right;
    width: 30.0417%;
    }
    }
    /* IE8 and IE7 */
    .ie .right-sidebar.custom-layout .site-content {
    float: left;
    width: 61.1042%;
    }
    .ie .right-sidebar.custom-layout .widget-area {
    clear: right;
    float: right;
    width: 30.0417%;
    }
    .ie .right-sidebar.custom-layout #extra-sidebar {
    clear: right;
    float: right;
    width: 30.0417%;
    }

    300px Wide Left Sidebar Layout

    Code:
    /* ===[ 300px Left Sidebar Layout ]=== */
    @media screen and (min-width: 600px) {

    .left-sidebar.custom-layout .site-content {
    float: right;
    width: 61.1042%;
    }
    .left-sidebar.custom-layout .widget-area {
    width: 30.0417%;
    float: left;
    clear: left;
    }
    .left-sidebar.custom-layout #extra-sidebar {
    float: left;
    width: 30.0417%;
    margin: 1.71429rem 0 0;
    }
    }
    .ie .left-sidebar.custom-layout .site-content {
    float: right;
    width: 61.1042%;
    }
    .ie .left-sidebar.custom-layout .widget-area {
    float: left;
    clear: left;
    width: 30.0417%;
    }
    .ie .left-sidebar.custom-layout #extra-sidebar {
    float: left;
    clear: left;
    width: 30.0417%;
    margin: 1.71429rem 0 0;
    }

Viewing 1 post (of 1 total)

The topic ‘300px Wide Sidebar Layouts’ is closed to new replies.