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

Jak ustawić grafikę na środku strony?

VPS Starter Arubacloud
0 głosów
483 wizyt
pytanie zadane 31 grudnia 2015 w HTML i CSS przez kacper1445 Gaduła (4,880 p.)

Robię stronę responsywną i na jednym z poradników zauważyłem, że prezenter zaczyna robić prace od wersji na telefon. Postanowiłem też tak zrobić. I wszystko pięknie, ładnie, ale nie mogę poradzić sobie z obrazkiem, który podczas rozciągania zostaje za bardzo na lewo. Używając procentów, myślałem, że nie będę mieć tego typu problemu...

Dołączam kod, żeby wszyscy zrozumieli...

.header img
{
    margin-left: 20%;
}

Wszelkie pytania proszę podawać w odpowiedziach.

3 odpowiedzi

+1 głos
odpowiedź 31 grudnia 2015 przez writen Nałogowiec (29,060 p.)
wybrane 31 grudnia 2015 przez kacper1445
 
Najlepsza
Wystarczy, że wsadzisz obrazek do kontenera (może to być już ten element .header, wtedy nie musisz tworzyć nowego), który będzie miał 100% szerokości i dodatkowo nadasz mu text-align: center;

Możesz też zmienić sposób wyświetlania obrazka na blokowy (display: block;) i ustawić automatyczne marginesy margin-left: auto; i margin-right: auto;
komentarz 31 grudnia 2015 przez kacper1445 Gaduła (4,880 p.)
Dzięki :) Pomogło
0 głosów
odpowiedź 31 grudnia 2015 przez Vodoo Dyskutant (9,270 p.)
.header img
{
     width: x px;
     display: block;
     margin-left: auto;
     margin-right: auto;
}

Zamiast x podajesz szerokość grafiki, automatycznie będzie na środku dzięki margin: auto.

komentarz 31 grudnia 2015 przez writen Nałogowiec (29,060 p.)
Element musi być blokowy, aby to zadziało. Patrz: display: block;
komentarz 31 grudnia 2015 przez Vodoo Dyskutant (9,270 p.)
Racja, poprawione.
komentarz 31 grudnia 2015 przez writen Nałogowiec (29,060 p.)

Spoko. napisałem o tym minutę wcześniej w mojej odpowiedzi wink

–2 głosów
odpowiedź 31 grudnia 2015 przez xSvilen Mądrala (5,740 p.)
Może :

margin-left: 50%;
komentarz 31 grudnia 2015 przez kacper1445 Gaduła (4,880 p.)
Wtedy mam grafikę za bardzo przesuniętą w prawo... Ale jak mam 20% to mam idealnie na środku... dopiero przy rozciąganiu coś idzie nie tak

Podobne pytania

0 głosów
3 odpowiedzi 1,054 wizyt
pytanie zadane 21 listopada 2015 w HTML i CSS przez Nightv13 Użytkownik (850 p.)
0 głosów
1 odpowiedź 140 wizyt
pytanie zadane 15 kwietnia 2021 w HTML i CSS przez Kubs Mądrala (5,190 p.)
0 głosów
2 odpowiedzi 138 wizyt
pytanie zadane 8 lipca 2020 w HTML i CSS przez ShadoWs Bywalec (2,800 p.)

92,455 zapytań

141,263 odpowiedzi

319,099 komentarzy

61,854 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

Akademia Sekuraka 2024 zapewnia dostęp do minimum 15 szkoleń online z bezpieczeństwa IT oraz dostęp także do materiałów z edycji Sekurak Academy z roku 2023!

Przy zakupie możecie skorzystać z kodu: pasja-akademia - użyjcie go w koszyku, a uzyskacie rabat -30% na bilety w wersji "Standard"! Więcej informacji na temat akademii 2024 znajdziecie tutaj. Dziękujemy ekipie Sekuraka za taką fajną zniżkę dla wszystkich Pasjonatów!

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!

...