CODEWITHSUNDEEP
reactjsresponsive-designmaterial-ui
Deivbid
Deivbid

Reputation: 403

How to make components responsive?

I build a react step by step form using material UI, I don't understand why I'm getting this behaviour when comes to responsive:

responsive

It is like eveything goes tiny. How can I properly make it responsive? Thanks!

This is the desktop version:

desktop

Upvotes: 0

Views: 152

Answers (1)

Ana Liza Pandac
Ana Liza Pandac

Reputation: 4871

Use the viewport meta tag to fix that issue on mobile devices.

<meta name="viewport" content="width=device-width, initial-scale=1">

Put it inside the <head> element in your index.html.

The attributes supplied in the content above is very basic so if you want to add more configurations you can use the other attributes specified below.

Other attributes that are available are minimum-scale, maximum-scale, and user-scalable. These properties affect the initial scale and width, as well as limiting changes in zoom level.

See MDN docs for more information.

Upvotes: 2

Related Questions