Need help? Check out our Support site, then


Create a sidebar for Chunk Theme

  1. I have followed everyone's awesome advice on adding the sidebar to the Chunk theme, but I am having one issue: When the window is sized down, the widget doesn't stay in a container of sorts. -- Instead, it moves in front of my content. Could someone help me with a CSS fix? Thank you!
    This is what I have:

    #container {
    height: auto;
    margin: 0 auto;
    width: 590px;
    }
    #header {
    min-height: 180px;
    padding-top: 70px;
    width: 590px;
    }
    #contents {
    border-left: 1px solid #ccc;
    height: auto;
    margin-left: 199px;
    padding-bottom: 10px;
    }
    #widgets {
    border-top: medium none;
    float: right;
    position: absolute;
    right: 0;
    top: 505px;
    width: 160px;
    }
    #widgets .widget {
    width: 160px;
    }

    and then down in the =Widgets section of the style:

    #widgets {
    border-top: 1px solid #ccc;
    margin: 30px 0 0 0;
    padding: 30px 0 0 0;
    text-align: left;
    }
    .widget-title {
    color: #555;
    font-family: 'Oswald', Helvetica, Arial, sans-serif;
    font-size: 16px;
    margin: 0 0 12px 0;
    text-transform: uppercase;
    }
    .widget-title a {
    color: #000;
    text-decoration: none;
    }
    #widgets .widget-area {
    width: 100%;
    }
    #widgets .widget {
    float: right;
    padding: 10px;
    width: 100%;
    }

    The blog I need help with is thebrightnessofbeing.com.

  2. updated, but still overlapping (I'm wondering if it's the container?):

    #container {
    height: auto;
    margin: 0 auto;
    width: 800px;
    }
    #header {
    min-height: 180px;
    padding-top: 70px;
    width: 800px;
    }
    #contents {
    border-left: 1px solid #ccc;
    height: auto;
    margin-left: 195px;
    padding-bottom: 10px;
    }
    #widgets {
    border-top: medium none;
    float: right;
    position: absolute;
    right: 0;
    top: 505px;
    width: 180px;
    }
    #widgets .widget {
    width: 180px;
    }

  3. One thing you could do would be to anchor the sidebar to the main content container instead of to the right side of the browser window. Here's an example you can try, add this:

    #container {
    	position: relative;
    }

    Then find the #widgets block in your custom CSS and change "right: 0;" to "right: -190px;"

    Aside: I checked http://thebrightnessofbeing.com/ and I found that site is setup using WordPress software, but it is not hosted here at WordPress.com. See http://support.wordpress.com/com-vs-org/ to learn about the differences.

    For further help with the Chunk theme specifically, you should ask at http://wordpress.org/support/theme/chunk or ask at http://wordpress.org/support/ if you have general WordPress questions.

Topic Closed

This topic has been closed to new replies.

About this Topic