Hey, I wanted to have the same background for my nav bar and first section so I put a background for the body. All is well until I tried the published versions of my site on my iPad and iPhone to see that the BG picture is not big enough and results in my web showing some white as you can see from the pictures.
I was suggested to put the background on my section, but it doesn’t make it cohesive with my navbar. Is there any way to fix this? On designer, it looks fine but on the finished product it doesn’t.
When you say “Showing some white”, what exactly do you mean? Kind of hard to understand. Also, make sure your nav links have the same text size on each state.
It is seen on the pictures I provided. It is showing the white background instead of the ACTUAL Body background picture because the picture is not long enough . However, I already tried decreasing the padding for my section and it is still showing the white background
Ah I see, it’s showing white on my Samsung tablet as well. But the section background image settings are disabled, then when I enable it, the preset is pointed top-left.
Try pointing it to center or center-top, then publish and I can see on my tablet again.
Because the size is a little small for a header - width wise. It should be around 3000x2500 at least. This one is 1425x951. But I understand it’s your image (which is very cool by the way), you don’t have a larger one available? I would reduce these at all. It can be much bigger, with no problems. Accelerators can handle larger size that’s compressed.
Oh sure, in PS you can compress it. In Affinity as well. Yeah you need it to be bigger, just lower the % output in photoshop. It’s possible to get down to 900-400kb.
If you can’t, then email me the photo and I’ll do it for ya.
I think I fixed it! When you have the chance please click on the live link and let me know
I did what you said about turning down the quality so the image size is bigger. However, I ran into the same problem so I just clicked on the HiDPi and it seemed to have worked!
Awesome! Wait, did you use the same read-only site? I’m looking and don’t see the image change.
But hey, I would change to this:
SECTION 2
Remove it from the background - and delete all the section settings, no blue settings, remove all
On Section 2: Height 110vh
Add image inside section, set 100% on both
That structure will work better for what you’re trying to do. Images on backgrounds don’t scale and they’re not controllable. Set that up and let me see what to adjust.
No on Section 2, set the height - type in 110vh, enter
On the image placed inside it, set height and width to 100%
I’m heading out to eat, but I’ll be back, respond here on what you find after that and I’ll join you back. But that will allow for the larger image to be positioned better. Yeah don’t use background setting, add as an image, then adjust. I’ll hit you back.
