How can I make a web site to automatically fit any size of screen | Sololearn: Learn to code for FREE!
New course! Every coder should learn Generative AI!
Try a free lesson
+ 2

How can I make a web site to automatically fit any size of screen

26th Sep 2021, 7:02 PM
Freedom Jombo🇳🇬
Freedom Jombo🇳🇬 - avatar
16 Answers
+ 3
You can research responsive web design
27th Sep 2021, 9:07 AM
Hamza Akburak
Hamza Akburak - avatar
+ 3
2 steps: 1. Use meta tag viewport ... to make page basically responsive. 2. @media is helpful to change css to be more responsive and better show in mobile devices.
28th Sep 2021, 12:51 AM
Sijad
Sijad - avatar
+ 3
You can learn from the freecodecamp lessons
28th Sep 2021, 12:54 PM
Abdugaffor Erkinboev
Abdugaffor Erkinboev - avatar
+ 2
Freedom Jombo this emphasis could help you to set @media sizes for different devices. https://css-tricks.com/snippets/css/media-queries-for-standard-devices/
26th Sep 2021, 11:03 PM
BroFar
BroFar - avatar
+ 2
You can use media queries to make your website responsive or use bootstrap framework
27th Sep 2021, 1:33 PM
Mohamed Shafnas
+ 1
Yes I have one
26th Sep 2021, 8:20 PM
Freedom Jombo🇳🇬
Freedom Jombo🇳🇬 - avatar
+ 1
Try this. <meta name="viewport" content="width=device-width, initial-scale=1"> It is always helpful to share your code bit so that community can better help you. Use Codeplay ground to upload your code and then share the link.
26th Sep 2021, 9:12 PM
Chris Coder
Chris Coder - avatar
+ 1
use website builder 😁 front-end developers are always struggling to make it responsive. Some others even code template for desktop and tablet, and other one for mobile to save him/herself from horrible headaches
27th Sep 2021, 8:56 AM
iTech
iTech - avatar
28th Sep 2021, 1:32 AM
ShadowCipher
ShadowCipher - avatar
28th Sep 2021, 12:50 PM
arad bane
arad bane - avatar
+ 1
Well with the least effort, you can use css libaries like bootstrap or tailwind, but if you’re just starting out, learn it via css. There’s a course here on SoloLearn called responsive design, which contains the solution to your problem. Or if you want an out-of-the-box solution you can even use a cms like wordpress or joomla.
28th Sep 2021, 2:08 PM
Bé Pont Dé
Bé Pont Dé - avatar
+ 1
The @media rule, introduced in CSS2, made it possible to define different style rules for different media types. Media queries in CSS3 extended the CSS2 media types idea: Instead of looking for a type of device, they look at the capability of the device. 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 to desktops, laptops, tablets, and mobile phones (such as iPhone and Android phones). Example @media screen and (min-width: 480px) { body { background-color: lightgreen; } }
28th Sep 2021, 5:34 PM
Arun Jamson
Arun Jamson - avatar
+ 1
Hassan Krima You may use the <video> element. In the future please create a new post for questions that are not on topic. Also use the search feature before asking in the Q/A. https://www.sololearn.com/Discuss/2751058/?ref=app
8th Nov 2022, 10:26 PM
Chris Coder
Chris Coder - avatar
0
Well, that is a tricky question. The simple answer is to use vh and vw, but this question is rather broad. Do you have a code you are trying to make responcive?
26th Sep 2021, 7:17 PM
Brain & Bones
Brain & Bones - avatar
0
Ok
26th Sep 2021, 9:13 PM
Freedom Jombo🇳🇬
Freedom Jombo🇳🇬 - avatar
0
How to make a video on the site
8th Nov 2022, 8:32 PM
Hassan Krima