Center an image that is too big for the screen?

Navigation
0

I have an image that has a height of 100% . However, width exceeds the side limits and the image is cropped from the right side and I would like to center it to cut equally from both sides. Here's a JsFiddle I did for demo

    
asked by anonymous 14.03.2018 / 20:52

1 answer

1

You can use as background and apply background-position: center

Documentation: link

  

Note: background-position: center can be used directly within background: , as in the example 

.foo {
     width: 100%;
}

.foo .cover {
     /* propriedades para centralizar e assim irá aparar igualmente ambos lados */
     background: url(https://i.stack.imgur.com/DD8Pf.jpg) center no-repeat;

     /* a altura exata da imagem */
     height: 1350px;
}
<div class="foo">
    <div class="cover"></div>
</div>
    
14.03.2018 / 21:06
JavaScript button in Animate CC Capture the IP and local machine name