How can I hide an element off the edge of the screen?

Question

I\'ve got a div that I want to position partially off-screen like so:

div{
    position: absolute;
    height: 100px;
    width: 100px;
    right: -50px;
            


        

Answer 1

Another solution is to use margin-left: 100%;

And if you wanted to play with the positioning a bit, you can do something like margin-left: calc(100% + 10px);

And another alternate way is to do float: right; and then play around with margin-right -50px; where 50px is the width of the hidden div. You could even have a neat transition if you animate the margin-right if you were making a menu.