WordPress.org

Ready to get started?Download WordPress

Forums

CSS Sidebar Size Error (5 posts)

  1. Josh132
    Member
    Posted 2 years ago #

    I have been trying to edit the sidebars of my website to make them larger to take out some of the empty space between the sidebars and content area. I know about doing them in proportion with each other using the CSS percentages, adjusting the margin and content area etc. But when I try to adjust the sidebar on the right (which is the #secondary code) it doesn't seem to do anything. #content and #extra-sidebar works just not the one. I am using wordpress 3.3.2 with all updates and the NomNom theme which is just Twenty Eleven with some extra bells and whistles.

    This is the website I am working on http://joshscarttest.x10.mx/wp/
    Here is the code I am working with

    .three-column #page { max-width: 1000px;}
    .three-column #primary {
    float: left;
    margin: 0 -26.4% 0 0;
    width: 100%;
    padding-bottom: 30px;
    }
    .three-column #content {
    margin: 0 34% 0 26.4%;
    width: 46.4%;
    height: 400px;
    background-color: #eaeaea;
    border-top:solid #181818 20px;
    -moz-border-radius: 15px;
    border-radius: 15px;
    box-shadow: 10px 10px 5px #888;
    }
    .three-column #secondary {
    float: right;
    margin-right: 2.6%;
    width: 20.8%;
    height: 400px;
    background-color: #eaeaea;
    border-style:solid;
    border-width:2px;
    border-color:#181818;
    border-top:solid #181818 20px;
    -moz-border-radius: 15px;
    border-radius: 15px;
    box-shadow: 10px 10px 5px #888;
    }
    .three-column #extra-sidebar{
    position:relative;
    float: left;
    width: 20.8%;
    margin-left: -70%;
    height: 400px;
    background-color: #eaeaea;
    border-top:solid #181818 20px;
    -moz-border-radius: 15px;
    border-radius: 15px;
    box-shadow: 10px 10px 5px #888;
    }

  2. WPyogi
    Volunteer Moderator
    Posted 2 years ago #

    Are you using Firebug to view the pages "live" so you can see what the code is actually doing?

    That secondary sidebar is being styled from this file:
    http://joshscarttest.x10.mx/wp/wp-content/plugins/twenty-eleven-theme-extensions/moztheme2011.css?ver=3.3.2

    on line 28:

    .moz-widget-list-adjust #secondary {
        width: 20.3%;
    }
  3. Josh132
    Member
    Posted 2 years ago #

    I am using firebug, probably just looked at the left sidebar and assumed it was the same for all of them XD.
    Thanks for the reply. And should I add the margin info on the .moz-widget or adjust that with the style.css?

  4. WPyogi
    Volunteer Moderator
    Posted 2 years ago #

    It should ideally be done in style.css, but it may not work because of overriding of the .moz-widget stylesheet... in that case, change the selector or put in the other stylesheet...But do be aware that if you do the latter, that CSS will be gone if you ever need to deactivate that plugin -- so not so great in that respect.

  5. Josh132
    Member
    Posted 2 years ago #

    Ok, thanks for the help.

Topic Closed

This topic has been closed to new replies.

About this Topic