# Full page background image **URL:** \ **Category:** Elements\ **Created:** [January 20, 2026, 11:26am UTC](https://forums.realmacsoftware.com/t/full-page-background-image/53740 "2026-01-20T11:26:06Z")\ **Posts on this page:** 10\ **Page:** 1
**Author:** ![johnhiggins](https://dub1.discourse-cdn.com/flex005/user_avatar/forums.realmacsoftware.com/johnhiggins/32/33610_2.png) [@johnhiggins](https://forums.realmacsoftware.com/u/johnhiggins)\ **Post date:** [January 20, 2026, 11:26am UTC](https://forums.realmacsoftware.com/t/full-page-background-image/53740/1 "2026-01-20T11:26:06Z")
Hi, I’m trying to set up a full screen background image that fills the entire browser window without distortion. All content, including the navbar, headings and text, needs to sit on top of the image. I’ve tried using the Background component with every combination of settings but can’t get it to behave consistently across desktop and mobile. I’ve tried to achieve this with a container and the background component with no joy. Cheers, John ---
**Author:** ![dan](https://dub1.discourse-cdn.com/flex005/user_avatar/forums.realmacsoftware.com/dan/32/28516_2.png) [@dan](https://forums.realmacsoftware.com/u/dan)\ **Post date:** [January 20, 2026, 12:28pm UTC](https://forums.realmacsoftware.com/t/full-page-background-image/53740/2 "2026-01-20T12:28:45Z")
Just add the image to the background of a Container, like this… ---
**Author:** ![johnhiggins](https://dub1.discourse-cdn.com/flex005/user_avatar/forums.realmacsoftware.com/johnhiggins/32/33610_2.png) [@johnhiggins](https://forums.realmacsoftware.com/u/johnhiggins)\ **Post date:** [January 20, 2026, 1:47pm UTC](https://forums.realmacsoftware.com/t/full-page-background-image/53740/3 "2026-01-20T13:47:50Z")
Great, thanks Dan. Will this work with dynamic content? If I’m pulling data from a database and the page might only have a couple of lines of text, will it still display a full page background image? Hope that makes sense. ---
**Author:** ![MultiThemes](https://dub1.discourse-cdn.com/flex005/user_avatar/forums.realmacsoftware.com/multithemes/32/25117_2.png) [@MultiThemes](https://forums.realmacsoftware.com/u/MultiThemes)\ **Post date:** [January 20, 2026, 2:35pm UTC](https://forums.realmacsoftware.com/t/full-page-background-image/53740/4 "2026-01-20T14:35:54Z")
I’d like to suggest a method to extend the background even if the content is positioned smaller than the page height. This solution maintains the normal CONTAINER behavior and works (in my experience) better than the Content Layout/Height/Screen option. I’m not sure if this is what you’re looking for but you can try ![extendBG](https://europe1.discourse-cdn.com/flex005/uploads/realmacsoftware1/original/3X/d/9/d93ce038850cd7473fb377878389ec5b860807f7.jpeg) ---
**Author:** ![johnhiggins](https://dub1.discourse-cdn.com/flex005/user_avatar/forums.realmacsoftware.com/johnhiggins/32/33610_2.png) [@johnhiggins](https://forums.realmacsoftware.com/u/johnhiggins)\ **Post date:** [January 20, 2026, 3:02pm UTC](https://forums.realmacsoftware.com/t/full-page-background-image/53740/5 "2026-01-20T15:02:28Z")
Great, thanks! 👍 ---
**Author:** ![MultiThemes](https://dub1.discourse-cdn.com/flex005/user_avatar/forums.realmacsoftware.com/multithemes/32/25117_2.png) [@MultiThemes](https://forums.realmacsoftware.com/u/MultiThemes)\ **Post date:** [January 20, 2026, 8:37pm UTC](https://forums.realmacsoftware.com/t/full-page-background-image/53740/6 "2026-01-20T20:37:49Z")
I’m happy to help, let me know if it works for you ---
**Author:** ![johnhiggins](https://dub1.discourse-cdn.com/flex005/user_avatar/forums.realmacsoftware.com/johnhiggins/32/33610_2.png) [@johnhiggins](https://forums.realmacsoftware.com/u/johnhiggins)\ **Post date:** [January 28, 2026, 11:29am UTC](https://forums.realmacsoftware.com/t/full-page-background-image/53740/7 "2026-01-28T11:29:19Z")
Just playing around with this now. Is there a way to make the background image fixed so it doesn’t scroll with the content? ---
**Author:** ![MultiThemes](https://dub1.discourse-cdn.com/flex005/user_avatar/forums.realmacsoftware.com/multithemes/32/25117_2.png) [@MultiThemes](https://forums.realmacsoftware.com/u/MultiThemes)\ **Post date:** [January 28, 2026, 11:46am UTC](https://forums.realmacsoftware.com/t/full-page-background-image/53740/8 "2026-01-28T11:46:32Z")
You can use the dedicated element[Background](https://www.youtube.com/watch?v=YlKQaLTm1hY) try [this free project](https://marketplace.realmacsoftware.com/elements/projects/future) I made an alternative, using a fixed container (which contains nothing else) and is underneath everything. ---
**Author:** ![WeaverPixel](https://dub1.discourse-cdn.com/flex005/user_avatar/forums.realmacsoftware.com/weaverpixel/32/25453_2.png) [@WeaverPixel](https://forums.realmacsoftware.com/u/WeaverPixel)\ **Post date:** [January 28, 2026, 11:47am UTC](https://forums.realmacsoftware.com/t/full-page-background-image/53740/9 "2026-01-28T11:47:47Z")
Hi @johnhiggins depends what you are using to create a background. There are 2 usual ways, the one is with a container and the other one is with the background component. For the background component there is an option “Background Fixed” like in the screenshot below. Enable this setting and your background fills the screen and stays fixed. ![image](https://europe1.discourse-cdn.com/flex005/uploads/realmacsoftware1/original/3X/5/9/59485d856d340905b0e15a0c5324d92898536fb6.png) As far as I know you do not have this possibility with the Container component. ---
**Author:** ![upssjw](https://dub1.discourse-cdn.com/flex005/user_avatar/forums.realmacsoftware.com/upssjw/32/26063_2.png) [@upssjw](https://forums.realmacsoftware.com/u/upssjw)\ **Post date:** [January 28, 2026, 4:36pm UTC](https://forums.realmacsoftware.com/t/full-page-background-image/53740/10 "2026-01-28T16:36:36Z")
all containers not sure if this what you mean, probably Michelangelo’s suggestion project - [elementsapp://downloadDocument/k3wonm3OiL2V](elementsapp://downloadDocument/k3wonm3OiL2V)