Responsive Screen Width CSS Code

Code CSS dibawah dapat digunakan untuk membuat tata letak atau aturan layar yang lebih dinamis atau fleksibel/responsive.

/* extra small devices - screen width less than 576px */
@media only screen and (max-width: 576px) {
    /* Your CSS code here.. */
}

/* small devices - screen width equal to or greater than 576px */
@media only screen and (min-width: 576px) {
    /* Your CSS code here.. */
}

/* medium devices - screen width equal to or greater than 768px */
@media only screen and (min-width: 768px) {
    /* Your CSS code here.. */
}

/* large devices - screen width equal to or greater than 992px */
@media only screen and (min-width: 992px) {
    /* Your CSS code here.. */
}

/* Extra large devices - screen width equal to or greater than 1200px */
@media only screen and (min-width: 1200px) {
    /* Your CSS code here.. */
}