YouTipResponsive Design
/* Mobile first */
.container { width: 100%; }
@media (min-width: 768px) {
.container { width: 750px; }
}
@media (min-width: 1024px) {
.container { width: 960px; }
}
@media print {
.no-print { display: none; }
}Summary
- Media queries apply styles based on device characteristics
- Mobile-first approach: start small, add breakpoints