简体   繁体   中英

Angular Material Not Responsive on Mobile

I've developed my site using Angular Material. The desktop version is perfect. However, when viewed on mobile the entire site looks broken and misplaced. I'm wondering if this is because I have not set the cols size for every element on my site? Any help on how to fix this on mobile would be appreciated. Below I attached my meta tags in case that might be the issue. The site is here along with the source code .

<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="description" content="">
<meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no" />
<meta name="viewport" content="width=device-width">

I've determined that if you add the appropriate cols size attributes for a small screen this solved my problem. So use md-cols-sm="2" in the html tags that need to be sized on the mobile screen.

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM