0

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?

Aidan Young
  • 102
  • 2
  • 6
  • You should check what media query is ! – Evren Mar 04 '21 at 20:00
  • Does this answer your question? [How to change
    size based on devices](https://stackoverflow.com/questions/42521778/how-to-change-div-size-based-on-devices)
     – Glazbee Mar 05 '21 at 14:49

2 Answers2

2

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.

Nikhil Singh
  • 1,486
  • 1
  • 13
  • 24
0

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?

Evren
  • 4,147
  • 1
  • 9
  • 16