Ask your WordPress questions! Pay money and get answers fast! Comodo Trusted Site Seal
Official PayPal Seal

Make Background a set dimension WordPress

  • SOLVED

I am using the Wordpress Theme Karma from Themeforest.com (version 2.7.0) and Wordpress version 3.3.2. My website name is nanba.com/wordpress. I have added a custom background but when the webpage is zoomed in our out (anything other than 100%), my background no longer fits and begins to repeat. What code must I add and where must I add it, to make my background zoom in and out with the rest of my website.

Answers (2)

2012-06-27

Arnav Joy answers:

try changing in line no.202 on style.css

#main {
background: url("http://nanba.com/wordpress/wp-content/uploads/2012/06/white-background.png") repeat-x scroll 0 0 transparent;
display: table-footer-group;
position: relative;
width: 100%;
}

to

#main {
background: url("http://nanba.com/wordpress/wp-content/uploads/2012/06/white-background.png") no-repeat scroll center top #003869;
display: table-footer-group;
position: relative;
width: 100%;
}


Socrates Ponnusamy comments:

Arnav
Thank you very much! IT WORKED. AWESOME. You solved my problem.
Socrates


Socrates Ponnusamy comments:

Arnav
I dont know how you get paid for this. Please let me know if you have any issues.
Socrates


Arnav Joy comments:

i will get paid when you vote for me , so please go ahead and vote me


Socrates Ponnusamy comments:

It says I cannot vote. I am getting following message.

"You are not allowed to vote"


Socrates Ponnusamy comments:

I voted now. I found it.

2012-06-27

RNWest answers:

Hi There,

Try changing your min-width to width 100%

Like

From: body {
background: none repeat scroll 0 0 #F4F4F2;
color: #666666;
font: 1.2em/20px "helvetica neue",Helvetica,Arial,Verdana,sans-serif;
margin: 0;
min-width: 1003px;
}


To: body {
background: none repeat scroll 0 0 #F4F4F2;
color: #666666;
font: 1.2em/20px "helvetica neue",Helvetica,Arial,Verdana,sans-serif;
margin: 0;
width: 100%;
}

Hope this helps


Socrates Ponnusamy comments:

Hello,

Thank you for your reply but I am sorry this did not work. When I zoom out in the browser, the background still stays the same dimensions, while the rest of the page changes. I have attached a screenshot below. Also, I have attached the code I changed. I changed the min-width below from 1003px to 100%. If you see the image, you can see that our background image is repeated twice as well.


body {
line-height:1;
background:#f4f4f2;
font:1.2em/20px "helvetica neue",Helvetica,Arial,Verdana,sans-serif;
color:#666;
min-width:100%;
margin:0;
}