CSS Overflow-x Hidden and Overflow-y

问题

I read through this question and didn't see if there is a solution to my issue.

I've created a CodePen that shows this issue. I would like everything to the left and right (overflow-x) of the red border to be hidden, but keep the top and bottom (overflow-y) visible.

Any ideas on how to achieve this affect?

回答1:

update your .movie-posters style to this. And check if this is what you are looking for.

.movie-posters {
  position: relative;
  width: 800px;
  height: 450px;
  margin: 6rem auto;
  border: 4px solid red;
  overflow-x:hidden;
}

i had to increase the height to make it look normal.

来源：https://stackoverflow.com/questions/44208454/css-overflow-x-hidden-and-overflow-y