MyBB Community Forums

Full Version: Background image not resizing
You're currently viewing a stripped down version of our content. View the full version with proper formatting.
I have run into a problem with my background image,

Whats going on is I got my background image to resize to what ever size screen you have and was working good, But Then I started trying some new images out for the background and now the images will not resize now.

I have the same settings in global.css
body {
	background: url(images/duende2/bg/bg1.png) no-repeat fixed;
	background-size: cover;
	line-height: 1.4;
	margin: 0;
	overflow-y: scroll;
	overflow-x: hidden;

but its not changing it is just displaying all the images as there normal res size.

Any Ideas why this is happening?
Try using this and fiddling around with it to your desire:

body {
    background: url(images/duende2/bg/bg1.png); 
    background-repeat: no-repeat;
    background-attachment: fixed; 
    background-position: center;
    background-size: cover;
    line-height: 1.4;
    margin: 0;
    overflow-y: scroll;
    overflow-x: hidden;


This guide here may help you too!

And to answer your question as why it is happening it is because your code is wrong.  Specifically here:

 background: url(images/duende2/bg/bg1.png) no-repeat fixed;
Hope this helps.
Thanks for the reply scoopy
I tried your code but didn't make any difference.
Something weird is going on because I removed the image and put a color in its place and the background image is still there.
I also tried totally removed all the code for the background and the background image is still showing.
I have cleared the cache tried a different browser with no luck,,

So my next question: Is mybb saving these settings somewhere else like to the database ?
Can you link the website so people can take a look?
,,,,,,,,,,,,,,,,,,,,,,,,,,,,
Go to dropback.css and find the following: 

.fondo1

.fondo2

.fondo3

Find .fondo1 (Line 260) and change the code to:

.fondo1 {
   background: url(images/duende2/bg/bg1.png);
   background-repeat: no-repeat;
   background-attachment: fixed; 
   background-position: center;
   background-size: cover;
   line-height: 1.4;
   margin: 0;
   overflow-y: scroll;
   overflow-x: hidden;
}

Now find .fondo2 (Line 270) and add all the code above with slight changes.

.fondo2 {
   background: url(images/duende2/bg/bg2.png);
   background-repeat: no-repeat;
   background-attachment: fixed; 
   background-position: center;
   background-size: cover;
   line-height: 1.4;
   margin: 0;
   overflow-y: scroll;
   overflow-x: hidden;
}

As you can see the only thing that changes is the class name (.fondo1 -> .fondo2 -> .fondo3) and the image URL.

So then you want to find .fondo3, add the code, and change the image url to whatever you want.
That worked Perfectly Scoopy thanks a lot.
Just had to adjust the logo and perfect Smile