Need help? Check out our Support site, then


Remove picture border and fill in sidebar in Adelle theme

  1. Hi,

    I'm using the Adelle theme with custom upgrade on my blog. I have two things I'd like to change:
    1) The background of the entire page is white, but the sidebar has a very light gray shading which I'd like to remove.
    2) I've added a picture with a caption to the sidebar, and the I'd like to remove the picture border as well as the gray filling behind the text.

    I've done some customization in CSS but I'm a complete novice to it, so I'd really appreciate any help.

    Thanks in advance!
    Laura

    The blog I need help with is thecopenhagentales.com.

  2. @lauriladida

    I've added the following CSS to your site to address your issues:

    div#secondary.widget-area {
      background: #FFF;
    }
    
    div.wp-caption.aligncenter {
      background: #FFF;
      border: 0;
    }

    To learn more about how CSS editing works at WordPress.com, see these helpful pages:

    http://en.support.wordpress.com/custom-design/css-basics/

    http://en.support.wordpress.com/custom-design/editing-css/

    Let us know if you have any more questions :-)

  3. This is great, thank you so much!!

    One thing I've noticed is that the sidebar doesn't work properly when viewing the page on a smartphone (it shows up at the bottom of the page instead) - is this because I set it to custom width?

    Thanks again!

  4. @lauriladida

    OK, I've replaced your Image widget with a Text widget. It contains the same content, but since we are now using HTML, it allows for greater customization. Now, the content will behave appropriately when resizing the portal window.

    Also, I commented out the following CSS:

    .site-main .widget-area {
    	width: 27.4118%;
    }
    
    .content-area {
    	width: 64.7451%;
    }

    I would leave this CSS out, as it is interfering with how your site displays at smaller portal sizes.

    Your site's content is supposed to reformat itself when being viewed on devices with different screen sizes. On phones, this often means your site will be presented as a single column, with your site's Sidebar at the bottom.

    Usually, this is the best solution and results in an optimal experience for your user/viewer.

    Let us know if you have any more questions :-)

  5. Thanks very much for your help, it's much appreciated.
    I figured it was because I had tried to shrink the sidebar, but I'd rather it look good on all devices.
    Thanks again!
    Laura

  6. @lauriladida

    Awesome, and you're welcome!

    If you have any other questions regarding WordPress.com, please let us know :-)

Topic Closed

This topic has been closed to new replies.

About this Topic