To have img auto centered horizontally:
img { /* prevent weird alignment with other elements */ display: block; /* keep it centered */ margin: auto; } Different width to target for media query:
/* landscape tablet */ @media only screen and (max-width: 960px) { .main, header { height: auto; } } /* vertical tablet */ @media only screen and (max-width: 700px) { li { display: block; padding: 0.5rem 0.9rem; text-align: center; } } /* smart phone */ @media only screen and (max-width: 470px) { .quote q, .location p { font-size: 1.3rem; } } 
Top comments (0)