Modern layouts aren’t about forcing everything into a grid—they’re about understanding your content and letting the design serve it. CSS Grid finally gave us the tool to build two-dimensional layouts that make sense for complex, content-rich websites. That’s what drives my work in Hong Kong’s digital ecosystem.
Professional Journey
14 years building sophisticated layout systems for Hong Kong’s most demanding digital properties
Started at Digital Agency
Joined a small Hong Kong digital shop as junior frontend developer. First projects involved wrestling with float-based layouts and discovering their limitations on high-traffic property portals.
University of Hong Kong — Computer Science
Completed degree while working full-time. The coursework in algorithms and data structures shaped how I think about layout efficiency and performance optimization for large-scale websites.
Senior Developer Role
Led frontend teams on financial dashboards and magazine-style content platforms. Started experimenting with CSS Grid in production as browser support improved, pioneering grid-based layouts for regional clients.
Grid Architecture Specialist
Became the go-to expert for complex grid implementations. Architected grid-template-areas systems for over 50 enterprise websites. Started writing technical articles and speaking at regional frontend conferences.
Joined GridFlow Design Limited
Became Senior Frontend Architect and head of layout innovation. Now leading a team working on responsive gallery systems, subgrid implementations, and Grid-Flexbox component architectures for Asia-Pacific’s largest digital projects.
Published & Speaking
Authored 30+ technical articles on grid-template-areas strategies, Grid-Flexbox combinations, and auto-fit/auto-fill responsive techniques. Regular speaker at frontend conferences across Hong Kong, Singapore, and Shanghai.
Core Expertise Areas
Deep knowledge across modern CSS layout systems and responsive design strategies
Grid-Template-Areas
Mastering intuitive two-dimensional page layouts using named grid areas. I’ve designed systems for 200+ websites that adapt from mobile to desktop without reordering content or losing semantic meaning.
Grid + Flexbox
Combining CSS Grid at the page level with Flexbox for component-level flexibility. This hybrid approach gives us the best of both worlds—two-dimensional page layouts with one-dimensional component flexibility.
Magazine Layouts
Building sophisticated magazine-style and card-based layouts for content-rich Hong Kong business sites. These designs handle variable content lengths, multilingual typography, and complex visual hierarchies elegantly.
Responsive Galleries
Implementing auto-fit and auto-fill techniques for dynamically responsive galleries that adapt to any viewport without breakpoints. These galleries handle hundreds of items while maintaining performance.
Subgrid Architecture
Using CSS subgrid for consistent alignment across nested layout components. This advanced technique ensures visual harmony across complex nested structures without duplicating grid logic.
Responsive Design
Building layouts that respond elegantly to the unique viewport challenges of Hong Kong’s digital ecosystem—from mainland visitors on desktop to international users on various devices.
What I’ve Built
Real projects, real constraints, real results
Enterprise websites designed with grid systems
Years specializing in modern layout systems
Technical articles published on CSS Grid strategies
I’ve worked on Hong Kong’s biggest digital properties—financial platforms with real-time data, property portals with thousands of listings, media sites with complex content structures. Each project taught me something new about how layouts should serve content, not the other way around.
My clients include major banks, real estate groups, and digital media companies across Hong Kong and the Asia-Pacific region. The work’s been challenging because Hong Kong’s market demands multilingual support, handles traffic spikes from mainland visitors, and expects pixel-perfect designs across dozens of devices.
Featured Articles
Deep dives into CSS Grid and modern layout techniques
Grid-Template-Areas: Building Intuitive Two-Dimensional Layouts
Named grid areas transform how we think about layout. Instead of calculating column and row numbers, we can name our layout regions and move them around intuitively. This guide covers everything from basic setup to complex responsive patterns that adapt across devices.
Combining Grid and Flexbox for Component Layouts
Grid handles the big picture. Flexbox handles the details. When you combine them strategically, you get layout systems that are both powerful and maintainable. We’ll explore hybrid approaches that work for real-world projects with complex component hierarchies.
Magazine and Card-Based Layouts for Content-Rich Sites
Content-rich sites need layouts that breathe. We’ll build magazine-style designs that handle variable content lengths, create card systems that scale to hundreds of items, and establish visual hierarchies that guide users through dense information without overwhelming them.
Auto-Fit and Auto-Fill for Dynamic Responsive Galleries
Stop writing media queries for galleries. Auto-fit and auto-fill let your grids respond to viewport width automatically, creating layouts that adapt without explicit breakpoints. Perfect for galleries with variable item counts and changing viewport sizes.
About Michael
The person behind the code
I’m a frontend architect with 14 years of experience building sophisticated layout systems. My background in Computer Science from the University of Hong Kong gave me a foundation in algorithms and system design—skills that translate directly into building efficient, scalable CSS architectures.
What I really love is solving the specific challenges of Hong Kong’s digital ecosystem. We’ve got multilingual typography requirements, traffic patterns from mainland and international visitors, and clients who demand pixel-perfect designs at scale. Those constraints don’t frustrate me—they’re what got me interested in modern CSS layout systems in the first place.
The journey from float-based layouts to CSS Grid feels like a natural progression. Each new technique taught me something deeper about how layouts should work. Grid didn’t just give us new tools—it changed how I think about the relationship between content and design. When you’re not fighting with floats and clearfixes, you can focus on what actually matters: making the layout serve the content.
At GridFlow Design Limited, I lead a team working on some of the region’s most complex digital projects. We’re not just building layouts—we’re establishing systems that scale, adapt, and make sense for content-rich websites. That’s the work that excites me: designing systems, not just individual pages.
Outside of work, I’m always reading about new CSS developments, experimenting with layout ideas, and thinking about how upcoming specifications like container queries will change how we approach responsive design. I speak regularly at frontend conferences across Hong Kong, Singapore, and Shanghai, and I’ve published over 30 articles on CSS Grid strategies and responsive design techniques.
Get in Touch
Interested in discussing layout systems, CSS Grid strategies, or frontend architecture? I’d love to hear about your project.