CSS bg image with position fixed and centered?

[stewart]

For days now….I have being trying to fix/centre my background image in the correct way. I have attached a example to show this.

I need my bg image to be fixed, with a horizontal stretched 2535px, and a vertical stretched of 100%, and can be scroll down.

hope this is possible? as Im being at it for a long time…

https://ibb.co/XshVbsB
https://ibb.co/Pz2r8Gp

[Beverleyh]

Please provide a working demo in CodePen so that we can see your code in action.

Can you also clarify what undesirable behaviour you are trying to fix vs what you would like/expect it to do instead.

[stewart]

html {height:100%;}
body {
position: fixed;
height: 100%;
margin: 0px;
font-family: Arial;
font-size: 14px;
color: #999;
text-align: center;
background: #975d7f url(“pix/bg2.jpg”) no-repeat top center;
background-size: cover;
background-color: #000000;
overflow-y: scroll;
}

[stewart]

I need a the bg to stretch vertical, and horizontal bg resize to 2535px scroll bar?

[stewart]

instead is example here https://www.genesis-engine.org/why.htm

[Beverleyh]

Sorry – CodePen is the preferred platform here. It’s trusted, we are able to test live edits more easily there, and we can do so from any device (not just desktop). The setup encourages you to present us with minimal, clearly separated code; just enough to demo the problem, which helps us to help you more concisely and quickly.

Conversely, a live site link is more restrictive; it requires us to be on desktop and troubleshoot via the developer console, usually while filtering out all the other distractions of a full site codebase. Hence, it isn’t as easy or appealing for us to work that way. It also requires a level of trust, since many opportunists use forums to solicit extra hits, many of us simply won’t click on principle.

In short, you’re more likely to receive the help you want/need if you provide us with a reduced demo in CodePen.

[Author]

Posts