• Najnowsze pytania
  • Bez odpowiedzi
  • Zadaj pytanie
  • Kategorie
  • Tagi
  • Zdobyte punkty
  • Ekipa ninja
  • IRC
  • FAQ
  • Regulamin
  • Książki warte uwagi

IMG 100% szerokości 100% wysokości SKALOWANIE

Object Storage Arubacloud
0 głosów
688 wizyt
pytanie zadane 21 marca 2017 w HTML i CSS przez bat_kuba Użytkownik (600 p.)
edycja 21 marca 2017 przez bat_kuba
Witam,
prosiłbym o wskazówkę co mam poprawić w moim kodzie aby zdjęcie w klasie .slider było pełnych rozmiarów i skalowało się poprawnie. Prosiłbym również o podpowiedź co zrobić, aby zdjęcie z klasy .slider było dobrze umieszczone na stronie. Proszę również o wskazanie ewentualnych innych błędów w kodzie.

Wklejam link do kodu https://codepen.io/bat_kuba/pen/RpMZoa?editors=1010

Z góry dziękuję za poświęcony czas i odpowiedzi :D
komentarz 21 marca 2017 przez Codeboy Stary wyjadacz (12,120 p.)
co masz na myśli mówiąc pełnych rozmiarów?
komentarz 21 marca 2017 przez bat_kuba Użytkownik (600 p.)
Tzn że jak wkleję zdjęcie do klasy .slider nieważne jakich rozmiarów to bd się zawsze wyświetlało 100%x100% i się automatycznie skalowało :) I zapomniałem dodać żeby było w dobrym miejscu na stronie bo w tej chwili mi się posypało i nie wiem co zrobić :(

1 odpowiedź

0 głosów
odpowiedź 21 marca 2017 przez Codeboy Stary wyjadacz (12,120 p.)

height: 100% zadziała tylko wtedy gdy element, który jest rodzicem (w tym wypadku div .slider) ma ustawioną stała wartość (ustawiłem na 700px). Dodatkowo to:

left: 100%;
top: 100%;

position: absolute;
transform: translate(-100%, -50%);

dla obrazka jest całkowicie zbędne i psuło Ci cały layout.

Zobacz: https://codepen.io/anon/pen/xqWLyb

komentarz 21 marca 2017 przez bat_kuba Użytkownik (600 p.)
Chodzi mi trochę o co innego :)

Body mam ustawione na 1000px i chciałbym aby zdjęcie w klasie .slider wyświetlało się na całą szerokość okna przeglądarki i się odpowiednio skalowało :)
komentarz 21 marca 2017 przez Codeboy Stary wyjadacz (12,120 p.)
Czemu więc ustawiasz body na 1000px jak chcesz mieć elementy na full screen? :O
komentarz 21 marca 2017 przez bat_kuba Użytkownik (600 p.)
bo myslalem ze tak jest poprawnie x)

czyli lepiej dla kazdego diva itp oddzielnie ustalic szerokosc ? XD
komentarz 21 marca 2017 przez Codeboy Stary wyjadacz (12,120 p.)

body zostaw w spokoju ;) stylizuj elementy osobno. Podobny efekt uzyskasz jeśli ustawisz sobie width elementu na 70% (względem body, które ma 100%) + do tego margin: auto.

Ewentualnie możesz pobawić się flexboxem, którym ogarniesz środkowanie elementów itd, ale to więcej do ogarniania :)

Podobne pytania

0 głosów
1 odpowiedź 680 wizyt
pytanie zadane 19 maja 2019 w HTML i CSS przez husarbilu Początkujący (370 p.)
0 głosów
0 odpowiedzi 126 wizyt
+1 głos
2 odpowiedzi 286 wizyt
pytanie zadane 14 sierpnia 2021 w HTML i CSS przez Dawidziu Bywalec (2,630 p.)

92,757 zapytań

141,679 odpowiedzi

320,437 komentarzy

62,101 pasjonatów

Motyw:

Akcja Pajacyk

Pajacyk od wielu lat dożywia dzieci. Pomóż klikając w zielony brzuszek na stronie. Dziękujemy! ♡

Oto polecana książka warta uwagi.
Pełną listę książek znajdziesz tutaj.

Akademia Sekuraka

Niedawno wystartował dodruk tej świetnej, rozchwytywanej książki (około 940 stron). Mamy dla Was kod: pasja (wpiszcie go w koszyku), dzięki któremu otrzymujemy 10% zniżki - dziękujemy zaprzyjaźnionej ekipie Sekuraka za taki bonus dla Pasjonatów! Książka to pierwszy tom z serii o ITsec, który łagodnie wprowadzi w świat bezpieczeństwa IT każdą osobę - warto, polecamy!

...