?
Solved

Css help width

Posted on 2011-02-14
8
Medium Priority
?
213 Views
Last Modified: 2012-05-11
Hi- I am trying to widen the center white section and the bottom section of this site:

http:/ /www dot our golden years dot ca slash test

I can't figure this one out. I just think it could stand to be a little wider on the page.
0
Comment
Question by:mel200
  • 4
  • 3
8 Comments
 
LVL 16

Expert Comment

by:SSupreme
ID: 34893026
If you want to widen a white part, you have to adjust background image (bg_wrapper.gif) to your width and in line 13 (styles.css) increase value of width: ...:
0
 
LVL 3

Accepted Solution

by:
thecrew earned 2000 total points
ID: 34893079
In style.css on line 13 the width will control the main wrapper for the site, if you increase this the footer will dynamically increase in width.
Then on line 18 the width will control the wrapper for the three text columns.
The problem is that the white area is made up of 3 columns and it has a background image that gives it the black borders on the left and right. You will need to re-create this image if you plan on widening the white area.
Then on line 21 in style.css you can adjust the width to fill up the newly widened white area. This width is the width of each of the three columns. They are all controlled by the same class.
Then on line 27 you will want to increase the margin-right to make the "read more" buttons line up with the newly widened text columns.

This doesn't take into account the header but you hadn't mentioned that. I assume it should match the new width as well, in which case you could add this bit to your CSS (adjusting the width to suit your taste):
#banner img{ width:850px;}
You really should re-create that image at the correct width so you don't lose resolution.

Let me know how it goes!
0
 

Author Comment

by:mel200
ID: 34893318
Thanks!
0
Technology Partners: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

 

Author Comment

by:mel200
ID: 34917926
Hi, Sorry it's taken me so long to get back to you on this, I'm busy with other clients and will likely work on this on Saturday, since it's pretty complicated and involves graphics. Thanks again.
0
 
LVL 3

Expert Comment

by:thecrew
ID: 34919025
No problem! Good luck!
-Logan
0
 

Author Comment

by:mel200
ID: 34921001
Amazing, it's look really close to what I want, thanks- Can you just tell me whay I have these two little anomalies in the screenshot attached?
screenshot2.gif
0
 

Author Closing Comment

by:mel200
ID: 34930091
Perfect and complete answer, thanks! The little nerd I saw is on the image and fixed.
0
 
LVL 3

Expert Comment

by:thecrew
ID: 34930257
Thank you! And well done!
-Logan
0

Featured Post

Vote for the Most Valuable Expert

It’s time to recognize experts that go above and beyond with helpful solutions and engagement on site. Choose from the top experts in the Hall of Fame or on the right rail of your favorite topic page. Look for the blue “Nominate” button on their profile to vote.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

When crafting your “Why Us” page, there are a plethora of pitfalls to avoid. Follow these five tips, and you’ll be well on your way to creating an effective page.
When it comes to security, close monitoring is a must. According to WhiteHat Security annual report, a substantial number of all web applications are vulnerable always. Monitis offers a new product - fully-featured Website security monitoring and pr…
In this tutorial viewers will learn how to embed custom externally-hosted Google Fonts using the Google Font API in CSS Go to the Google Fonts website at google.com/fonts: Browse or search based on font properties or name to find a suitable font for…
The is a quite short video tutorial. In this video, I'm going to show you how to create self-host WordPress blog with free hosting service.
Suggested Courses

840 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question