The forum of the forums
Welcome to the Official Support Forum of Forumotion!

To take full advantage of everything offered by our forum, please log in if you are already a member, or join our community if you've not yet.



Create a free forum like this one.

Fixed background issues

View previous topic View next topic Go down

In progress Fixed background issues

Post by Kamui on February 22nd 2016, 6:51 pm

Code:
body {
    background-image: url("Image link");
    background-repeat: no-repeat;
}


FORUM LINK: http://narutogaiden.forumotion.com/

So this is the code I have, but the problem is the background isn't covering the entire form like I want it to, instead it's sitting in the upper-corner of the forum.

Kamui
Forumember

Male Posts : 280
Reputation : 3
Language : English
Location : Greed Island

http://narutogaiden.forumotion.com/

Back to top Go down

In progress Re: Fixed background issues

Post by Ange Tuteur on February 22nd 2016, 7:03 pm

Hey,

If you want the background image to fill the entire background you can use the
Code:
background-size
property. Like this :
Code:
body {
  background-size:cover;
  background-attachment:fixed;
}
You can remove
Code:
background-attachment:fixed;
if you want. That only fixes the background so it stays the same as you scroll.

Ange Tuteur
Forumaster

Male Posts : 13028
Reputation : 2704
Language : EN10, FR5
Location : Pennsylvania

http://fmdesign.forumotion.com

Back to top Go down

In progress Re: Fixed background issues

Post by Kamui on February 22nd 2016, 7:28 pm

Why's the background so huge now? It's like the longer the page its self is, the background constantly readjusts its self.

Kamui
Forumember

Male Posts : 280
Reputation : 3
Language : English
Location : Greed Island

http://narutogaiden.forumotion.com/

Back to top Go down

In progress Re: Fixed background issues

Post by Ange Tuteur on February 23rd 2016, 3:54 pm

That's the effect of "cover" you can try different values such as 100% :
Code:
body {
  background-size:100% 100%;
  background-attachment:fixed;
}

See this for more information :
http://www.w3schools.com/cssref/css3_pr_background-size.asp

Ange Tuteur
Forumaster

Male Posts : 13028
Reputation : 2704
Language : EN10, FR5
Location : Pennsylvania

http://fmdesign.forumotion.com

Back to top Go down

In progress Re: Fixed background issues

Post by Kamui on February 23rd 2016, 9:54 pm

I thought these codes would be of use but their no good either. Whenever I upload the background to pics, it spans out correctly, which looks more nice. The codes just mess up the background. I tried to remove the options for image url and just leave the no repeat. Could it be my image just isn't large enough?

Code:
div {
    background-image:url('smiley.gif');
    background-repeat:no-repeat;
    background-size:initial;
}


Code:
div {
    background-image:url('smiley.gif');
    background-repeat:no-repeat;
    background-size:contain;
}


Code:
div {
    background-image:url('smiley.gif');
    background-repeat:no-repeat;
    background-size:auto;
}



Kamui
Forumember

Male Posts : 280
Reputation : 3
Language : English
Location : Greed Island

http://narutogaiden.forumotion.com/

Back to top Go down

View previous topic View next topic Back to top


 
Permissions in this forum:
You cannot reply to topics in this forum