Solved

CSS background-image:url  help on wordpress website

Posted on 2013-01-24
7
400 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
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 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
Industry Leaders: 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 500 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

Secure Your WordPress Site: 5 Essential Approaches

WordPress is the web's most popular CMS, but its dominance also makes it a target for attackers. Our eBook will show you how to:

Prevent costly exploits of core and plugin vulnerabilities
Repel automated attacks
Lock down your dashboard, secure your code, and protect your users

Question has a verified solution.

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

Introduction A frequently asked question goes something like this:  "I am running a long process in the background and I want to alert my client when the process finishes.  How can I send a message to the browser?"  Unfortunately, the short answer…
This article shows the steps required to install WordPress on Azure. Web Apps, Mobile Apps, API Apps, or Functions, in Azure all these run in an App Service plan. WordPress is no exception and requires an App Service Plan and Database to install
The purpose of this video is to demonstrate how to Import and export files in WordPress. This will be demonstrated using a Windows 8 PC. Go to your WordPress login page. This will look like the following: mywebsite.com/wp-login.php : Click on Too…
Video by: Mark
This lesson goes over how to construct ordered and unordered lists and how to create hyperlinks.
Suggested Courses

630 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