Menu
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">
719
Angular Material is in simple terms is a set of components (i.e. Date Picker, Cards, Toolbar etc.) with the material design aesthetic. On its own, Angular Material can not provide a responsive design like bootstrap does.
Angular Material features many commonly used components in web applications. They are compatible with the most popular browsers and allow for responsive design to ease the development of applications that can fit the many platforms Angular already targets, from desktop to mobile and web.
The quickest answer would be, no, angular is not responsive by default.
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.
126
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
