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.

Issue with forum background image and custom image display

View previous topic View next topic Go down

In progress Issue with forum background image and custom image display

Post by Guest on September 17th 2014, 9:59 pm

Hello. I am having an issue with the way my forum background image and a custom image on my homepage are being displayed. My forum background is displaying tiled instead of as one image. The custom image on my homepage is not staying within the border of the body on the homepage and is stretching beyond it. It doesnt seem to have this issue on desktops using chrome, but shows this issue displaying on all other devices and browsers including mobile devices. Is there a way that I can force my forum background image to display as one image on all browsers and displays as well as force my custom image on the body of my homepage, to stay within the borders of the body where I have set it? My forum homepage is linked below.

http://redwhiteandbruce.forumotion.com/

Also, here is a screenshot of how it is being displayed via android devices, as well as mobile devices.


Guest
Guest


Back to top Go down

In progress Re: Issue with forum background image and custom image display

Post by Guest on September 19th 2014, 9:36 am

If I've posted in the wrong area, please let me know as I am fairly new to the forum. Thanks.

Guest
Guest


Back to top Go down

In progress Re: Issue with forum background image and custom image display

Post by SLGray on September 19th 2014, 9:40 am

Did you check the box called fixed background when you entered the image's URL?


When your topic has been solved, ensure you mark the topic solved.
Never post your email in public.


SLGray
Administrator
Administrator

Male Posts : 35634
Reputation : 2372
Language : English
Location : United States

http://fmthemes.forumotion.com/

Back to top Go down

In progress Re: Issue with forum background image and custom image display

Post by Guest on September 19th 2014, 9:41 am

Hello. Yes I did.

Guest
Guest


Back to top Go down

In progress Re: Issue with forum background image and custom image display

Post by SLGray on September 19th 2014, 9:44 am

What is the dimensions of the image?


When your topic has been solved, ensure you mark the topic solved.
Never post your email in public.


SLGray
Administrator
Administrator

Male Posts : 35634
Reputation : 2372
Language : English
Location : United States

http://fmthemes.forumotion.com/

Back to top Go down

In progress Re: Issue with forum background image and custom image display

Post by Guest on September 19th 2014, 9:47 am

Forum background image or the custom image?

Guest
Guest


Back to top Go down

In progress Re: Issue with forum background image and custom image display

Post by SLGray on September 19th 2014, 9:51 am

Background image.


When your topic has been solved, ensure you mark the topic solved.
Never post your email in public.


SLGray
Administrator
Administrator

Male Posts : 35634
Reputation : 2372
Language : English
Location : United States

http://fmthemes.forumotion.com/

Back to top Go down

In progress Re: Issue with forum background image and custom image display

Post by Guest on September 19th 2014, 10:04 am

Custom image's dimensions are 1024x293. Background image dimensions are 1024x682.

Problem is, both seem to be displaying normally on desktop browsers but not on any other devices, i.e. mobile, android, iAnything.. Background image is tiling on smaller displays and the custom image below my header, is expanded beyond the border as shown in the screenshot.

Guest
Guest


Back to top Go down

In progress Re: Issue with forum background image and custom image display

Post by Ange Tuteur on September 19th 2014, 3:25 pm

Hello Blusky,

If you want these elements to display at fixed sizes for different resolutions you will need to use percentages. Try adding this to your style sheet :
Display > Colors > CSS stylesheet
Code:
.panel.introduction .mes-txt img { width:80% }
body {
 background-repeat:no-repeat;
 background-size:100%;
}

The first rule is to adjust the image width so it doesn't break outside of the intro panel. You can adjust the percent(80%) as you wish. The second rule is to fit the background image to the screen.

Ange Tuteur
Forumaster

Male Posts : 13021
Reputation : 2683
Language : EN10, FR5
Location : Pennsylvania

http://fmdesign.forumotion.com

Back to top Go down

In progress Re: Issue with forum background image and custom image display

Post by Guest on September 19th 2014, 6:05 pm

Hello Ange. Forgive my inexperience but where would I insert this in the stylesheet? I know how to get to the style sheet in the admin panel but I don't know if there is a specific place within the stylesheet to place the code. Again I apologize for my lack of knowledge buy thank you for your help.

Guest
Guest


Back to top Go down

In progress Re: Issue with forum background image and custom image display

Post by Ghost Pirate on September 19th 2014, 6:32 pm

Go to your Administration Panel then go to Display > Colors > CSS stylesheet add to the top of your CSS stylesheet the code.

Hope this helps

Ghost Pirate
Forumember

Male Posts : 255
Reputation : 78
Language : English, Greman, Spanish

Back to top Go down

In progress Re: Issue with forum background image and custom image display

Post by Guest on September 19th 2014, 7:54 pm

Hello Fish Crazy. Yes that did help, thank you kindly for your response!

Ange, custom image is now set and staying within the border of the intro. panel., thanks for that!

Background image is now no longer tiling, however is now only covering 50% of the display on all devices other than desktop browsers. Is there a way to configure it to fill the screen, without tiling, on mobile devices/iPads? I've attached a screenshot below of how it is displaying. Thanks again for your help and time.


Guest
Guest


Back to top Go down

In progress Re: Issue with forum background image and custom image display

Post by SLGray on September 19th 2014, 8:20 pm

When I view the page source for your forum's homepage, it is set to 50% for the background image.

no repeat scroll 0 50%


When your topic has been solved, ensure you mark the topic solved.
Never post your email in public.


SLGray
Administrator
Administrator

Male Posts : 35634
Reputation : 2372
Language : English
Location : United States

http://fmthemes.forumotion.com/

Back to top Go down

In progress Re: Issue with forum background image and custom image display

Post by Guest on September 19th 2014, 8:43 pm

I'm not sure why it is set like that. I did not modify anything for the background other than setting "fixed" for the image and the code that was provided earlier. Is there something I could be missing?

Guest
Guest


Back to top Go down

In progress Re: Issue with forum background image and custom image display

Post by Ange Tuteur on September 19th 2014, 10:14 pm

In the body rule, replace :
Code:
background-size:100%;

by :
Code:
background-size:100% 100%;

This will stretch the image so it fits the screen. If you don't want this, remove :
Code:
background-repeat:no-repeat;

Instead, so the image repeats itself.

Ange Tuteur
Forumaster

Male Posts : 13021
Reputation : 2683
Language : EN10, FR5
Location : Pennsylvania

http://fmdesign.forumotion.com

Back to top Go down

In progress Re: Issue with forum background image and custom image display

Post by Guest on September 19th 2014, 11:22 pm

Hello Ange. I made the change as instructed but still the same issue. The devices I'm having this display issue with are listed below if that has any relevance.

Kindle Fire
Droid Razr Maxx
iPad2

Guest
Guest


Back to top Go down

In progress Re: Issue with forum background image and custom image display

Post by Ange Tuteur on September 20th 2014, 7:35 am

I made a test with responsive design in Firefox, and it fit to many different resolutions. It could be that the background-size property is not supported for your device. If that's the case you'll most likely have to repeat the image, or keep it as is.

Ange Tuteur
Forumaster

Male Posts : 13021
Reputation : 2683
Language : EN10, FR5
Location : Pennsylvania

http://fmdesign.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