Jul 31, 2017 13:26:01 GMT -5
Trying to adjust the board so that depending on the size of the screen, it adjusts the board to the right and doesn't cover the background image on the left. Below are some screenshots of what it appears on my screen (screenshot 1) and my friend's screen (screenshot 2), I'm hoping there's a code that'll adjust it so the background image isn't covered? or if there's another way to go about doing this, I'm all ears.
[screen 1] -
[screen 2] -
[site link]Any help or advice/insight is greatly appreciated, thanks for your time. ♥
I'm around and round we go
Moderator
Jul 31, 2017 19:43:12 GMT -5
So I am not entirely sure if this is what you wanted, but if you update your #wrapper css to:
#wrapper {
width: calc(100% - 416px - 20px);
max-width: 900px;
/* margin: 0 auto -20px; */
overflow-x: hidden;
position: relative;
left: 416px;
background-color: #060606;
padding: 10px;
}
That way the background graphic will always stay the same width (which happens to be 416px) on the left.
Jul 31, 2017 21:27:46 GMT -5
Smangii,
Thanks for the response! I tried as you said and replaced the current wrapper to what you put but unfortunately not sure what I could have done wrong. This is what ended up happening.
screenshot
I'm around and round we go
Moderator
Aug 1, 2017 17:43:06 GMT -5
Arg.... I think the width might be formatted wrong... my bad! Try this:
#wrapper {
width: calc(~'100% - 416px - 20px');
max-width: 900px;
/* margin: 0 auto -20px; */
overflow-x: hidden;
position: relative;
left: 416px;
background-color: #060606;
padding: 10px;
}
Aug 1, 2017 19:45:27 GMT -5
Smangii ,
Edit:
It's all working exactly like it's supposed to, thanks so much for your help Smangii!! ♥