Title: changing whole theme width
Last modified: August 18, 2016

---

# changing whole theme width

 *  [aaronws](https://wordpress.org/support/users/aaronws/)
 * (@aaronws)
 * [21 years, 1 month ago](https://wordpress.org/support/topic/changing-whole-theme-width/)
 * All of my other pages are based on the width of my header image, which is 965px.
   I have messed with the CSS file a little bit, but I truly have no idea what I
   am doing.
 * Any idea how to fix this:
    [http://www.weblog.scribs.info/](http://www.weblog.scribs.info/)
 * I know some widths have to be changed in the style.css file, but I have played
   with it and have no idea which ones. I added 200px to the width of the main column,
   but the side colums did not move over as expected. I also expanded the background
   images to the respective 965px to match the header.

Viewing 9 replies - 1 through 9 (of 9 total)

 *  [Michael Bishop](https://wordpress.org/support/users/miklb/)
 * (@miklb)
 * [21 years, 1 month ago](https://wordpress.org/support/topic/changing-whole-theme-width/#post-200142)
 * I’m sure someone who’s better learned in CSS will follow up, but it appears that
   you have this div
    .narrowcolumn { float: left; padding: 0 0 20px 45px; margin:
   0px 0 0; width: 650px; } which is superseding the 965 that you want. Perhaps 
   try changing that and see if you get want you are looking for.
 *  [moshu](https://wordpress.org/support/users/moshu/)
 * (@moshu)
 * [21 years, 1 month ago](https://wordpress.org/support/topic/changing-whole-theme-width/#post-200143)
 * It ain’t that easy… especially with the Deafult theme.
    If you want a wide(r)
   theme look around and choose one that fits your needs, and try to tweak that 
   one.
 *  Thread Starter [aaronws](https://wordpress.org/support/users/aaronws/)
 * (@aaronws)
 * [21 years, 1 month ago](https://wordpress.org/support/topic/changing-whole-theme-width/#post-200144)
 * Just curious, what is the difference between downloading a theme and modifying
   it and modifying the default theme?
 * Ok, so I snagged a theme that looks cool and there is the CSS. What am I to modify
   to make this thing 965px wide throughout?
 * /*
    Theme Name: Amsterdam Nights Theme URI: [http://www.rollsroick.de/](http://www.rollsroick.de/)
   Description: You can have it here and now. Your Blog in the look and feel of 
   a warm summernight in Amsterdam. Author: Oliver Roick Author URI: [http://www.rollsroick.de/](http://www.rollsroick.de/)
   Version: 1.5
 * The CSS, XHTML and design is released under GPL:
    [http://www.opensource.org/licenses/gpl-license.php](http://www.opensource.org/licenses/gpl-license.php)
 * */
 * /* Da Basics */
 * body {
    background-color: #141C29; font-family: “Tahoma”, Verdana, Geneva, Arial,
   Helvetica, sans-serif; font-size: 12px; }
 * a, a:visited, a:link {
    color: #2E60A9; }
 * a:hover {
    text-decoration: none; background-color: #FFF7D1; }
 * a:active {
    background-color: #FFF7D1; }
 * input, textarea {
    background-color: #FFF7D1; }
 * input:focus, textarea:focus {
    background-color: #FFF; }
 * #wrapper {
    background-color: #2D5FA8; background-image: url(images/bg_main.png);
   background-repeat: repeat-y; margin: 20px auto; width: 650px; }
 * /* Header */
 * #head {
    height: 273px; width: 650px; background-image: url(images/bg_head.png);}
 * #head div#blog_title {
    font-family: “Trebuchet MS”, “Tahoma”, Verdana, Geneva,
   Arial, Helvetica, sans-serif; font-size: 2.5em; color: #FCFFF7; position: relative;
   top: 170px; left: 30px; }
 * #head div#blog_title a {
    color: #FCFFF7; text-decoration: none; }
 * #head div#blog_title a:hover {
    background-color: transparent; }
 * /*Main Content*/
 * #main {
    width: 425px; float: left; color: #141C29; }
 * #main h1, #main h2 {
    margin: 0 20px 5px 47px; font-family: “Trebuchet MS”, “
   Tahoma”, Verdana, Geneva, Arial, Helvetica, sans-serif; font-size: 2.0em; font-
   weight: normal; color: #2E60A9; }
 * #main h2 {
    font-size: 1.5em; }
 * #main h1 a, #main h2 a {
    text-decoration: none; }
 * #main p, #main div.navigation, #main ul, #main div.post_info, #main div.date,#
   main #searchform {
    margin: 0 20px 15px 50px; text-align: justify; line-height:
   1.4em; }
 * #main div.navigation {
    clear: both; }
 * .left {
    text-align: left; }
 * .right {
    text-align: right; }
 * #main div.post_info {
    border-top: 1px dotted #141C29; }
 * #main div.date {
    margin-bottom: 0px; }
 * /* Sidebar */
 * #sidebar {
    float: left; width: 220px; margin: 20px 0 0 0; padding: 0; list-style:
   none; background-image: url(images/bg_sidebar_main.png); background-repeat: repeat-
   y; }
 * #sidebar h4 {
    background-image: url(images/bg_sidebar_head.png); background-
   repeat: no-repeat; background-color: transparent; font-size: 1.3em; font-weight:
   normal; font-family: “Trebuchet MS”, “Tahoma”, Verdana, Geneva, Arial, Helvetica,
   sans-serif; margin: 0; padding: 25px 0 14px 20px; }
 * #sidebar ul {
    margin: 0; padding: 0 0 40px 0; list-style: none; background-image:
   url(images/bg_sidebar_footer.png); background-repeat: no-repeat; background-position:
   bottom left; }
 * #sidebar ul li {
    background: transparent; padding: 0 0 3px 30px; }
 * /*Footer*/
 * #footer {
    width: 650px; background-image: url(images/bg_footer.png); background-
   repeat: no-repeat; background-color: #2D5FA8; clear: both; padding-top: 50px;
   padding-bottom: 30px; color: #FCFFF7; }
 * #footer p {
    margin: 0 50px; font-size: 0.8em; line-height: 1.5em; }
 * #footer a, #footer a:link, #footer a:visited, #footer a:hover, #footer a:active{
   
   color: #FCFFF7; background: transparent; }
 * /* Comment Styles */
 * #commentform {
    margin-bottom: 40px; }
 * #commentform input, #commentform textarea {
    width: 305px; margin: 0 20px; padding:
   3px; color: #141C29; font-family: “Tahoma”, Verdana, Geneva, Arial, Helvetica,
   sans-serif; font-size: 1.0em; line-height: 1.4em; }
 * #commentform input[type=submit] {
    width: 13em; float: right; }
 * #commentform label {
    display: block; padding-bottom: 3px; }
 * #commentlist {
    margin: 0; padding: 0; margin: 0 20px 15px 50px; line-height:
   1.4em; list-style-type: none; }
 * #commentlist li {
    padding: 0; margin: 0 0 30px 0; }
 * #commentlist li p {
    padding: 0; margin: 0 3px 10px 3px; }
 * #commentlist cite {
    display: block; background-color: #FFF7D1; padding: 3px;
   font-style: normal; font-weight: bold; margin-bottom: 3px; }
 * #searchform input[type=submit] {
    margin-top: 2px; }
 * /*Comments Popup*/
 * #comments_popup {
    background-color: #FCFFF7; font-family: “Tahoma”, Verdana,
   Geneva, Arial, Helvetica, sans-serif; font-size: 12px; margin: 0; padding: 0;}
 * #comments_popup h1#header {
    background-color: #2D5FA8; margin: 0 0 20px 0; padding:
   10px; font-family: “Trebuchet MS”, “Tahoma”, Verdana, Geneva, Arial, Helvetica,
   sans-serif; font-size: 2.5em; color: #FCFFF7; }
 * #comments_popup h1#header a {
    color: #FCFFF7; text-decoration: none; }
 * #comments_popup h1#header a:hover {
    background-color: transparent; }
 * #comments_popup #main {
    width: 100%; }
 * #comments_popup #main p, #comments_popup #main h2, #comments_popup #main #commentlist{
   
   margin: 0 10px 15px 10px; padding: 0; }
 * #comments_popup #footer {
    background-color: #2D5FA8; background-image: none;
   width: 100%; padding: 10px 0; }
 *  [moshu](https://wordpress.org/support/users/moshu/)
 * (@moshu)
 * [21 years, 1 month ago](https://wordpress.org/support/topic/changing-whole-theme-width/#post-200145)
 * First lesson 🙂
    Do not paste here such a long code. It’s difficult to see it
   here. Instead you can use this site [http://pastebin.com/](http://pastebin.com/)
   and paste it there, then come back and post the URI.
 * 2nd. It’s not that simple as “modifying” one number and the theme will look as
   you wish.
    As for your question: modifying the Default seems to be quite difficult
   for beginners…
 *  [vkaryl](https://wordpress.org/support/users/vkaryl/)
 * (@vkaryl)
 * [21 years, 1 month ago](https://wordpress.org/support/topic/changing-whole-theme-width/#post-200150)
 * Try starting [here, in the Codex:](http://www.tamba2.org.uk/wordpress/graphicalcss/align/index.html)
   this section is a CSS reference for WP, should help you figure out where to start
   tweaking.
 *  Thread Starter [aaronws](https://wordpress.org/support/users/aaronws/)
 * (@aaronws)
 * [21 years, 1 month ago](https://wordpress.org/support/topic/changing-whole-theme-width/#post-200153)
 * cool, lesson learned =)
 * ah wow, never even knew about pastebin, that is awesome. I am into other development
   and never really had a taste or patience for web development and do not know 
   the first thing about desinging CSS sheets. I would prefer to code in C than 
   mess with HTML. The names in the CSS make logical sense, but how everything fits
   together, I am little lost and do not have time to sit down and learn it.
 *  [moshu](https://wordpress.org/support/users/moshu/)
 * (@moshu)
 * [21 years, 1 month ago](https://wordpress.org/support/topic/changing-whole-theme-width/#post-200201)
 * Then you’ll probably have to find somebody to customize your theme. Some might
   volunteer for that, others may charge a fee… YMMV
 *  [metabold](https://wordpress.org/support/users/metabold/)
 * (@metabold)
 * [21 years, 1 month ago](https://wordpress.org/support/topic/changing-whole-theme-width/#post-200236)
 * The first thing to do would be to change the width from 650px to 965px.
 * Then your main column is the wider “content” column.
 * and your “narrowcolumn” is your right hand column with the links in it.
 * So now raise the width or either the “content” left hand colum to use the remaining
   spacce minus the right hand nav or increase both.
 * Obviuosly your graphic will force the width. But it will be hard to control layout
   if you don’t update the style sheets widths to match.
 *  Thread Starter [aaronws](https://wordpress.org/support/users/aaronws/)
 * (@aaronws)
 * [21 years, 1 month ago](https://wordpress.org/support/topic/changing-whole-theme-width/#post-200251)
 * ok, so I went the easiest route on this one. I found a theme with a width of 
   800 and I just reduced the size of my graphics. I spent a few hours playing with
   the CSS and 30 seconds resizing graphics, I can live with the 800 width for saving
   that much time.
 * When I have more time, I will try the suggestions listed.
 * Thank you for your time to all of those that replied.

Viewing 9 replies - 1 through 9 (of 9 total)

The topic ‘changing whole theme width’ is closed to new replies.

## Tags

 * [width](https://wordpress.org/support/topic-tag/width/)

 * 9 replies
 * 5 participants
 * Last reply from: [aaronws](https://wordpress.org/support/users/aaronws/)
 * Last activity: [21 years, 1 month ago](https://wordpress.org/support/topic/changing-whole-theme-width/#post-200251)
 * Status: not resolved

## Topics

### Topics with no replies

### Non-support topics

### Resolved topics

### Unresolved topics

### All topics