Wyśrodkuj obraz ponadwymiarowy w Div

Próbowałem uporządkować, jak wyśrodkować ponadwymiarowy obraz w div, używając tylko css.

Używamy układu płynnego, więc szerokość kontenerów obrazów zmienia się w zależności od szerokości strony (wysokość div jest stała). Obraz znajduje się wewnątrz div, z wartością wstawionego cienia box, tak aby wyglądał, jakbyś przeglądał stronę na obrazie.

Sam obraz został tak dobrany, aby wypełnić otaczający div w jego najszerszej możliwej wartości (projekt mamax-width wartość).

Jest to dość proste, jeśli obraz jest mniejszy niż otaczający div:

margin-left: auto;
margin-right: auto;
display: block; 

Ale kiedy obraz jest większy niż div, po prostu zaczyna się od lewej krawędzi i znajduje się poza środkiem po prawej stronie (używamyoverflow: hidden).

Możemy przypisaćwidth=100%, ale przeglądarki wykonują kiepską pracę, zmieniając rozmiar obrazów, a projektowanie stron internetowych koncentruje się wokół wysokiej jakości obrazów.

Wszelkie pomysły na centrowanie obrazu, abyoverflow:hidden odcina równomiernie obie krawędzie?

questionAnswers(8)

yourAnswerToTheQuestion