First find this segment in your coding:
#outer-wrapper {The "width:692px;" line indicates the width of your header and post/sidebar sections together. You can change 692 to 800 (to fit Kristen's example) or desired width. I've managed with a 900 width, but that might be pushing it.
margin: 0 auto;
border: 0;
width: 692px;
text-align: left;
background: $mainBgColor url(http://www.blogblog.com/moto_son/innerwrap.gif) top right repeat-y;
font: $bodyFont;
}
Now find this segment in the coding:
#main {
width: 400px;
float: left;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
}
The "width: 400px;" indicates the width of the blog post area (not including sidebar). You'll want to widen this too, or you'll have a big wide area in the middle of your blog. I would suggest a width of 528 in Kristen's example, but you can play with different numbers to see what works.
Hope this all makes sense. It's a little challenging to try to explain. :)
10 comments:
Alicia, We were doing the same thing. I put Kristen's header on my test blog this morning, altering it in the same way that you altered it. The shading on the Son of Moto template is a picture. Thus, you can save it as a picture, widen it, save it on a website and then insert the url of the picture location (substitute the url that ends with outerwrap.gif) and voila your shading will be back. I am leaving the sample on my test blog, until Kristen sees it.
I don't mean to repeat myself ad infinitum, but thank you! You have both been so helpful.
thanks so much. it worked and i managed to widen my blog space and keep the sidebar, too, BUT i now have these rounded corners left where the margins used to be set. Does anyone know how to also move the corners, too, along with the margins themselves?
thanks,
Mike
Thanks so much for this! I have been trying to widen the margins of my blog forever! This trick was quite painless and super-quick!
Thanks for the step by step! Also, Christine's comment above was extremely helpful. I wanted to keep my shadowing. :)
Thanks for this post. It was simple & really helpful for a novice HTML editor like me.
THANK YOU! I've been trying to do this to my little old blog for months. Now if I can just figure out how to customize the background I'll be in heaven. Work in progress.
Thanks a million!! Now my pictures aren't cut off.
This works for photo posting... thank you! I am now having a challenge with the writing underneath the photo because the margins for this did not change. Can you help? Thanks.
Thank you so much, I was stuck and your blog helped me fix my problem and I so appreciate it!!
Post a Comment