Making the content width larger

• 

  mytravelmonkey · Member · Jan 21, 2014 at 12:26 pm

  • Copy link
  • Add topic to favorites

  Hi there, I am a complete novice to CSS and not sure how to widen the width of the content, and therefore reducing the width of the side bar?
  I’m using the reddle theme. Many thanks for your advice

  The blog I need help with is: (visible only to logged in users)

• 

  thesacredpath · Member · Jan 21, 2014 at 5:00 pm

  • Copy link

  The site you reference is using Confit. Is that the site you are talking about? Do you want to widen Reddle or Confit?

• 

  thesacredpath · Member · Jan 21, 2014 at 5:09 pm

  • Copy link

  Since you asked about Reddle, here is how to widen the content. The first rule below is the width for the sidebar. Adjust that as desired and then reduce the right margin value (51.25%) in the second rule by the same amount.

  #main .widget-area {
      width: 33.5714%;
  }
  
  .secondary #content {
      margin: 0 51.25% 0 9.46429%;
  }

  As an example, the following reduces the sidebar by 10% and increases the width of the content by the same amount.

  #main .widget-area {
      width: 23.5714%;
  }
  .secondary #content {
      margin: 0 41.25% 0 9.46429%;
  }

  Go to Appearance > Customize > CSS, delete all the informational text and paste in the above. For the above example, in the “Content Width” field enter 550 so that images and videos inserted at full size will come in at the new width.

• 

  mytravelmonkey · Member · Jan 21, 2014 at 9:25 pm

  • Copy link

  Thank you very much for your help

• 

  thesacredpath · Member · Jan 21, 2014 at 11:50 pm

  • Copy link

  You are welcome.