Pushing a box out of view

user_10364279 0
Viewed 159

So I am trying to experiment with my CSS code and want to know how to push a box out of view. Let me go into more detail...

I have lined up two boxes side by side using the grid element and would like box one to push box two out of the left margin so it is not visible. (I will be bringing it back into view later with animation). So at the starting point only box one is visible.

Does anyone know how to make this possible without adjusting the widths?

(I could do it by simply adjusting the width of box one but I am looking for different methods.)

css html
3 Answers

I am not completely sure if I am understanding your question but in css you can use display: none; to hide a block. You can then use display: block; to bring it back into view.

user_103725720

I am also not sure if I understand your question correctly, but you could try it with:

    margin-left: -23px

and on the outer element 

    overflow:hidden
user_103872480

Without code of the question, it is hard to answer, but let me try.

To hide element you could use display: none; or visibility: hidden; or opacity: 0;

You could also say to the parent element that it has position: relative; and to the element that you want to hide, position: absolute; left: 150%; or right: -50%;, depending on which element you would like to hide, left or right respectively. and with javascript or css animation change later its left or right property in order to show it.

There are a lot of ways for you to achieve what you want.

user_58338160
Related