Markus G. Markus G. - 4 months ago 41
Sass (Sass) Question

CSS/SASS method for fixing div

I hope you'll have an answer for me.
In CSS there's the property background-attachment: fixed; which looks really fancy, so my question is there any property which I can use to "fix" some divs with text's etc. in the document?
If not, how to solve it in Typescript?
I hope you know what I mean

//edit:
Okay, i will try to describe it: with the property background-attachment: fixed; the background of a div is fixed but not it's content, so a parallax effect appears, like this: w3schools.com/howto/tryhow_css_parallax_demo.htm And know I wanted to know if it is possible to do the same with the content like texts etc.

Answer

Can you try it like this ?

HTML

<div class="fixedContainer">
    This is experimental
</div>
<div class="otherContainer"> </div>

And here goes your style

CSS

<style>
.fixedContainer {
    background-color:#ddd;
    position: fixed;
    padding: 2em;
    left: 50%;
    top: 0%;
    transform: translateX(-50%);
}

.otherContainer {
    height:1000px;
    background-color:#bbb;
}

</style>

Credit originally goes to : this link and stackoverflow user aaronk6 and Joseph Marikle at their posts :

this link and at this link respectively.