Problem z wyśrodkowaniem obrazka

Question

Witam

Mam nieustanny problem z wyśrodkowaniem obrazka.Dziwi mnie to że jak wpisuje margin-left:160px;

to obrazek przesuwa się odpowiednio o te 160px w prawo a jak już wpisuje właściwości margin-left:auto; i margin-right:auto; to obrazek ustawia się po lewej stronie ekranu zachowując jeszcze jakiś odstęp.

Próbowałem też właściwości text-align:center; ale to również nic nie zmienia.

Co może być nie tak ?

Answer 1

Jako że img jest elementem inline, to wyśrodkować go możesz na dwa sposoby:

1. Ustawić text-align dla jego rodzica
2. Ustawić mu wyświetlanie blokowe i użyć margin auto

text-align na samym img nie zadziała, bo nie jest on elementem blokowym.

Answer 2

obrazem jest elementem liniowym, zachowuje się jak tekst :) 

Jeżeli chcesz go wyśrodkować to dla jego rodzica daj: 

text-align: center; tak samo jak w przypadku tekstu :p 

Jeżeli chcesz użyć margin: auto; to musisz dodać mu display: block; żeby obrazek zachowywał się jak obiekt o danej szerokości i wysokości :)  

 

Answer 3

Żebyście mogli mi łatwiej pomóc umieszczam link do tej strony.Obrazek znajduje się na tym tle gradientowym o kolorze fioletowym.

dawid-janik.pl

Na podstawie kodu źródłowego może powiecie mi gdzie mam zamieścić te właściwości by obrazek się wyśrodkował ?

Answer 4

Ma ktoś jakiś pomysł ?