- #99
- #98
- #97
- #96
- #95
- #94
- #93
- #92
- #91
- #90
- #89
- #88
- #87
- #86
- #85
- #84
- #83
- #82
- #81
- #80
- #79
- #78
- #77
- #76
- #75
- #74
- #73
- #72
- #71
- #70
- #69
- #68
- #67
- #66
- #65
- #64
- #63
- #62
- #61
- #60
- #59
- #58
- #57
- #56
- #55
- #54
- #53
- #52
- #51
- #50
- #49
- #48
- #47
- #46
- #45
- #44
- #43
- #42
- #41
- #40
- #39
- #38
- #37
- #36
- #35
- #34
- #33
- #32
- #31
- #30
Rethinking How to Build RWD Web Pages with CSS Container Queries
Container Queries already have 90% global support and will become an important tool for building independent RWD component styles in the era of web componentization.
Nowadays, we are more prefer to build web components and flexibly set them to adapt to various device sizes, rather than emphasizing specific designs for specific device sizes as in the early AWD. This is also why, despite the existence of Media Queries, there is still a need to introduce Container Queries - “to observe changes in specific meta web elements and apply different styles.”
- Media Queries: Easy to specify overall page styles
- Container Queries: Easy to specify individual elements’ styles at different sizes
Web Dong Dong has launched a related article.
To learn more about Container Queries and their examples, I highly recommend checking out Ahmad Shadeed’s website; the interactive examples are really impressive!
- #29
- #28
- #27
- #26
- #25
- #24
- #23
- #22
- #21
- #20
- #19
- #18
- #17
- #16
- #15
- #14
- #13
- #12
- #11
- #10
- #9
- #8
- #7
- #6
- #5
- #4
- #3
- #2
- #1