-1

I have an img in a container that is half of the containers height. The img is too big, so I'm using the object-fit property, however it's cutting the img off at the top. I'm using the following CSS and no matter what value I enter in the background-position property it doesn't do anything. 

.testbox img {
    position: relative;
    display: table-cell;
    width: 100%;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: bottom;
    overflow: hidden;
    height: 150px;
    -o-object-fit: cover;
    object-fit: cover;

Can anyone see anything wrong with what I'm doing? Any pointers would be really appreciated!

Thanks

Herro2689
  • 79
  • 10
  • 3
    Well `img` is not a _background_ image, so there is no reason `background-position` should have any effect on it. – 04FS Nov 28 '19 at 09:26

1 Answers1

1

The background-position property is only for background images You could use the property object-position for your img.

https://css-tricks.com/on-object-fit-and-object-position/

David Nazar
  • 556
  • 1
  • 4
  • 10