What is the body overlapping my element here?


In this example, if you change main div's 'left' property to something like 10%, the body will overlap the element. WHY? It's driving me crazy.

Any help is appreciated. Thanks!


This is occuring because you are using transform: translate(-50%, -50%);


I get that translate moves the div to left so its on the edge. But why is the body OVERLAPPING THE DIV instead of the div OVERLAPPING THE BODY?


overflow: auto; Is why that is happening If I understand you correctly.


That is correct. Thanks! Now, though, I have another question that you might be able to answer. Why am i unable to scroll to the left to see the hidden content? Even if i set overflow: scroll, it doesn't allow me to scroll to see the hidden content. Why?


I believe that overflow scroll only allows for scrolling to the right and bottom of the initial view.
If you think about it, it would be a little strange if a scroll bar bar started at the bottom or on the right when you opened a page.


Wow, you're totally right. Thanks a bunch Edwin!! :relaxed:


Awesome, you're welcome ^^.


This topic was automatically closed 7 days after the last reply. New replies are no longer allowed.