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)