How do you make your webpage respocive (auto adjust to screen size) to phone,tablet and computer or any other device??

Question

web based

Answer 1

The combination of media queries and technologies such as CSS Grid and Flexbox are an amazing combination to make responsive pages. Even if you use technologies such as Bootstrap / Bulma / Foundation, it is always good to know how to expand the possibilities at the time of development.

* https://developer.mozilla.org/es/docs/CSS/Media_queries

* https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Grid_Layout/Realizing_common_layouts_using_CSS_Grid_Layout

* https://robots.thoughtbot.com/flexboxes-media-queries-awesome-layouts

* https://envato.com/blog/css3-flexbox/

Answer 2

Lord Mystic Use the css @media queries. The @media rule is used in media queries to apply different styles for different media types/devices.

Media queries can be used to check many things, such as:

width and height of the viewport

width and height of the device

orientation (is the tablet/phone in landscape or portrait mode?)

resolution

Using media queries are a popular technique for delivering a tailored style sheet (responsive web design) to desktops, laptops, tablets, and mobile phones.
Examples :-
https://www.w3schools.com/css/css3_mediaqueries_ex.asp