Need help? Check out our Support site, then


Chateau Sidebar Length

  1. Hello CSS-team,

    I could use some help with my sidebar on http://healthninja.wordpress.com . It would be nice if it had the same length as the content. I tried to use height: 100% and min-height: 100%, but it didn't work.

    And, if somebody knows how to get rid of the black top-border of the WordPress-copyright section, that would be a huge help too. I'd love to have a wight background and grey border, so that it fits into the design.

    Thank you,
    Ksenija

    The blog I need help with is healthninja.wordpress.com.

  2. I don't help with CSS editing. I'm posting only to share my experience with you. My screen resolution size is Screen Resolution 1024 x 768 pixels and I am using Firefox 23 on a PC.

    Chateau is a responsive width theme. Responsive width means the the layout adapts depending on the size of the device being used to view your site. When responsive width themes are viewed on mobiles the sidebars appear below the posts in order to provide as much space as possible for reading.

    Adding the second sidebar means that I now have a horizontal navigation bar at the bottom that I have to use to view the page at full width and I refuse to follow any blog that compels me to do that.

  3. Thanks for sharing, but my problem is not the second sidebar, or the width of my theme but the length. Anyone suggestions how to solve that?

  4. No ideas, anyone? I could really need some help with this, please.

  5. @healthninja, this should do it for you, but you may want to shift some of the sidebar items around.

    #primary {
    background: #FFFFFF;
    max-width: 895px !important;
    }
    
    .content-sidebar #secondary {
    float: right;
    right: 63px;
    }
    
    #upper-footer-widgets {
    width: 97.3%;
    }
  6. One other thing I'll mention is that repositioning the stuff into the border area on the right means that the view when looking at your site on a smart phone or another smaller device will put your social icons over the top of your content. You can see this if you narrow your browser window way down. If you want to stay with this layout for computers, make sure and activate the mobile theme at Appearance > mobile so that it will use the mobile theme. You can activate it and then take a look at your site on a smartphone to see how it looks. If you have viewed your site on your smartphone already, you may have to clear the cache first to see the mobile theme.

  7. Thank you so much! It did exactly what it should. And thank you for the mobile theme hint, I actually implemented a mobile code, but it loads even faster this way.

    Any ideas on how to get rid of the black colophon line?

  8. For the bottom black line.

    #footer {
    border-bottom: none;
    }
  9. On second look there is another boarder line there.

    #copyright {
    border-top: none;
    }
  10. Health Ninja is a great name of a blog! :)

Topic Closed

This topic has been closed to new replies.

About this Topic