CODEWITHSUNDEEP
javascripthtmlcsswidthresponsive
Aidan Young
Aidan Young

Reputation: 102

Change the width of a div depending on the device

I would like to use css to add an effect so that a div has a width of 500px but only if the user is on a computer. If the user is on a mobile phone, tablet, iPad etc, it would have the predefined width. How would I accomplish this?

Upvotes: 0

Views: 1277

Answers (2)

Nikhil Singh
Nikhil Singh

Reputation: 1610

You are looking for media query, read more about it here. If you are curious knowing different view widths, you can refer to this:-

  1. 320px — 480px: Mobile devices
  2. 481px — 768px: iPads, Tablets
  3. 769px — 1024px: Small screens, laptops
  4. 1025px — 1200px: Desktops, large screens
  5. 1201px and more —  Extra large screens, TV

OR

You can use responsive units to set widths, like 100% or 100vw, know more about responsive units here.

Upvotes: 2

Evren
Evren

Reputation: 4410

Check this question if you want to detect device but anyway you would need media query. What is the best way to detect a mobile device?

Upvotes: 0

Related Questions