Change sidebar in Forever theme

• 

  cablueprinting · Member · Sep 26, 2012 at 1:45 am

  • Copy link
  • Add topic to favorites

  I changed the width of the entire blog to be wider. Now I want to make the right sidebar area narrower. How??

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

• 

  cablueprinting · Member · Sep 26, 2012 at 2:11 am

  • Copy link

  I figured it out. It was under secondary. Now I need to shorten my search box…

• 

  designsimply · Member · Sep 27, 2012 at 1:31 am

  • Copy link

  Nice! Any chance you could post the CSS you used to change the widths?

  To shorten the search box to match your other CSS, try this:

  #s {
  	width: 108px !important;
  }

• 

  cablueprinting · Member · Sep 27, 2012 at 3:13 am

  • Copy link

  Thank you! That worked!
  If you go to #page and adjust the width. I have mine at 1200px.
  Let me know if that worked :)

• 

  designsimply · Member · Sep 27, 2012 at 5:35 am

  • Copy link

  Adjusting #page works for the overall width, but not for the separate columns. My main reason for asking is to try to make sure all of the questions in the CSS forums have answers posted. :)

  I noticed something else that might help you. If you are new to CSS, the best way to make updates is to select the “Add my CSS” option on the Appearance → Custom Design → CSS page and then just add in small CSS snippets for changes you want to make that are different from the original stylesheet. You would just want to use the original stylesheet as a reference and not copy and paste the entire thing into the CSS editor.

• 

  cablueprinting · Member · Oct 2, 2012 at 7:22 am

  • Copy link

  How do I widen my post section? Changing #content Max-width can narrow it but not wider than how it is…
  There is invisible blockage.

• 

  designsimply · Member · Oct 3, 2012 at 12:55 pm

  • Copy link

  To change the main column width, you would want to change the container width as well. Here is an example:

  #page {
  	width: 1160px;
  }
  
  #content {
  	max-width: 870px
  }

  Adjust the numbers to the widths you’d like to use.

  If you change the main column width in CSS, it’s also a good idea to change the limit width setting in the Appearance → Custom Design → CSS settings as well.