Wyłączenie aspect ratio w CSS

0

Witam!

Mam obrazek osadzony w HTMLu w tagu img. Obrazek ma szerokość 200px, ale chcę go uciąć do 175px, więc stworzyłem klasę:
.small {width: 174px;}
I tu napotykam problem, bo to skaluje mi też wysokość, a tego chcę uniknąć.

0

To wpisz:
.small {width: 174px; height: rozmiar;}

edit:
poza tym jestem w internecie już spory czas i do tej pory nie widziałem sensownego zastosowania do przeskalowywania obrazków bez zachowania proporcji, czyli rozciągania. oświecisz mnie do czego takie coś stosujesz?

0

jesli chcesz obrazek przeskalowac to patrz odpowiedz @dzek69
ale ty piszesz cos na poczatku o ucieciu obrazka, a to nie jest to samo co przeskalowanie. Co dokladnie chcesz zrobic?

0

Mam obrazek, który używam w kilku miejscach. W niektórych potrzebny mi jest w całej swojej okazałości, w niektórych ucięty (nieprzeskalowany!) od prawej.

Z tym dopisaniem height to jest tak, że takich uciętych obrazków na stronie mam około 20. Każdy ma mieć dokładnie tą samą szerokość, ale wysokość jest już inna, niesprecyzowana, dlatego nie bardzo widzi mi się te rozwiązanie.

0

No to "uciąć" obrazek możesz tworząc kontener o określonych szerokościach i overflow:hidden, następnie umieścić w nim obrazek.

<div class="small"><img src="" alt="" /></div>
div.small { width: 174px; overflow: hidden; height: 200px; } /* skoro chcesz ucinać obrazek na długości to wysokość jest chyba stała? */
div.small img { height: 100%; } /* to niekoniecznie potrzebne, zobacz sobie, która wersja bardziej Ci odpowiada */
1

ustaw obrazek jako tło dla jakiegoś diva o określonym rozmiarze, ew. background-position aby ustalić którą część obrazka przyciąć.

1 użytkowników online, w tym zalogowanych: 0, gości: 1