Go Premium for a chance to win a PS4. Enter to Win

x
?
Solved

CSS background-image:url  help on wordpress website

Posted on 2013-01-24
7
Medium Priority
?
404 Views
Last Modified: 2013-01-27
Hello,

Our current site is at

www.thewealthymind(dot)com

The home page is a bit different than internal pages graphically.

Attached are screenshots of what I want the home page and internal page CSS backgrounds to look like. I simply want a light grey background on the left and right side of the page with a 1px dark grey border between the inside of the page and the left and right. Same with the internal pages (see screenshots)

I'm open to whatever is easiest to do when it comes to the grey in the footer.

I've also attached a screenshot of my proposed background image that will do the job, though I'm open to suggestions.

It also has to look good in all modern browsers.

I can't figure it out. Please help.
wanted-background.png
internal-screenshot-how-I-want-i.png
css-image-for-background.gif
0
Comment
Question by:weikelbob
  • 4
  • 3
7 Comments
 
LVL 25

Expert Comment

by:Kyle Hamilton
ID: 38817066
You won't need a background image if all you want are some borders:

#content, .content{
border-left: 8px solid grey;
border-right: 8px solid grey;
}

The screenshots attached are kind of blurry, and I'm not sure how pixel perfect you want the solution. But my advice is not to try to reach pixel perfection, and use css instead of images to accomplish the goal.
0
 
LVL 7

Author Comment

by:weikelbob
ID: 38817128
#content, .content{
border-left: 8px solid grey;
border-right: 8px solid grey;
}

Is that what goes in my style.css, or is that just generally what you would do.

I want the grey borders on the left and right to extend indefinitely, or at least as large as any screen will be.

Thanks.
0
 
LVL 25

Expert Comment

by:Kyle Hamilton
ID: 38817227
yes. put it in your css file. The borders will extend as far as the content div.
0
Independent Software Vendors: 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!

 
LVL 7

Author Comment

by:weikelbob
ID: 38817436
I put it in and it created a small border on the left and right.

So I made the border 1000px wide and that didn't work - I couldn't see the page anymore, just the border.

I want a border on the left and right that extends left and right until it hits the left and right sides of the screen.
0
 
LVL 25

Accepted Solution

by:
Kyle Hamilton earned 2000 total points
ID: 38818316
ok. that's not what's in your picture.

you already have a background image that you are using. just change that image to reflect what you want. and make the background color of the content divs white.
0
 
LVL 7

Author Comment

by:weikelbob
ID: 38820325
That will work, I tried to portray that in my images, sorry.

I'll give this a shot
0
 
LVL 7

Author Closing Comment

by:weikelbob
ID: 38825359
Thanks!
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

As a result of several questions about how to use Bootstrap I thought it would be a good idea to write down the development aspect of creating a Bootstrapped website in as little time as possible. Part 1 of this article will only concentrate on g…
While Plesk offers many potential benefits to website administrators, including compatibility with Windows Server and other leading technologies, the company has also been working to differentiate it from other control panels for content management…
The purpose of this video is to demonstrate how to prevent comment spam on a WordPress Website. This will be demonstrated using a Windows 8 PC. Plugin Akismet will be used. Go to your WordPress login page. This will look like the following: myw…
The viewer will learn the benefit of using external CSS files and the relationship between class and ID selectors. Create your external css file by saving it as style.css then set up your style tags: (CODE) Reference the nav tag and set your prop…
Suggested Courses

972 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