I am running 2 column cutline at http://shortsaleblogger.com
i want to make the whole blog wider to 970 px.
how do i start?
I am running 2 column cutline at http://shortsaleblogger.com
i want to make the whole blog wider to 970 px.
how do i start?
must admit, i am a little disappointed by an abandoned forum. loved this theme but had to change as my skills are not sufficient to make the simple changes necessary.
Check out the "core layout section of your style sheet" you'll find the following IDs
#container - this element is the container for everything on your site, it's width will need to be set to 970px. You shouldn't have to mess with margin or padding.
#content_box - This is the container for your content and sidebar. You will need to set it's width to 970px. You shouldn't have to mess with margin or padding.
#content -
#sidebar
These boxes hold your posts and sidebar, respectively. This is where the math comes in. What ever you set their widths to, you need to be able to add their widths, and their padding together to equal 970px. I believe the padding on these elements is set to 20px on the right side of the content, and 15px on the left of the sidebar (for an overall gutter of 35px) but I am not sure because I use a three column version. But let's assume that this holds true. So go ahead and subtract that 35px from 970px right away, and you're left with 935px of space for your content. So now you can set your widths to anything really so long as it adds up.
So let's say you set the main area to 600px and your sidebar to 335px... feel free to mess with these values so long as it all adds up.
Almost done...
#footer - set to 970px. No padding/margin to worry about.
There... that's it basically, except if you skim the style sheet you'll notice that anything within the content section (stuff related to posts, comment form, etc.) and anything in the sidbars (widget styles) will currently all have widths relating to the old values. You'll have to go through and, if, say, your values initially were 500px for your content, change any instance in the sheet of 500px to your new value of 650px.
Same for sidebar stuff.
Just remember, in CSS, the overall width of an element is the content width (value you set for width) plus padding plus margin plus border. And don't forget, if you have a padding of 2px on the left and right of an element, you have to add that twice (4px)
Got it?
I hope you already have an understanding of CSS, because I am not going to teach it to you, but if you want to learn visit: http://www.w3schools.com/
You must log in to post.