Site Owners Forums - Webmaster Forums - View Single Post

nesir · 07-24-2017, 11:00 PM

The best way i found was through media queries , this basically tells the website that if the screen width is lower than x amount and higher than y amount ( follow this new set off css rules ), and those css rules will be different for the view-port size ...

Google Media queries i think this is the standard approach by all web developers,
also there is a way called "fluid grid layout" of which i dont have much knowledge.

FLexbox
and Bootstrap , i will caution you on templates though as often times you will find alot of code bloating.

Something that worked for me ....
Open your website in developer tools like chrome then resize it until things start going bad ...
set a media query for that view width ..
then in developer mode adjust the css until all looks good ..
copy it and paste it into you media query ...
then resize further and repeat until you get to 320 width,

another thing get into the habit of using vw and % to set heights ,widths and margins it will help with the scaling process until thing get too small then you use media queries.

Just google them there are tons of tutorials online.

Let us know how you fare
Good luck

07-24-2017, 11:00 PM	#9
nesir Registered User Join Date: Jul 2017 Location: south africa Posts: 38	The best way i found was through media queries , this basically tells the website that if the screen width is lower than x amount and higher than y amount ( follow this new set off css rules ), and those css rules will be different for the view-port size ... Google Media queries i think this is the standard approach by all web developers, also there is a way called "fluid grid layout" of which i dont have much knowledge. FLexbox and Bootstrap , i will caution you on templates though as often times you will find alot of code bloating. Something that worked for me .... Open your website in developer tools like chrome then resize it until things start going bad ... set a media query for that view width .. then in developer mode adjust the css until all looks good .. copy it and paste it into you media query ... then resize further and repeat until you get to 320 width, another thing get into the habit of using vw and % to set heights ,widths and margins it will help with the scaling process until thing get too small then you use media queries. Just google them there are tons of tutorials online. Let us know how you fare Good luck __________________ To view links or images in signatures your post count must be 10 or greater. You currently have 0 posts. To view links or images in signatures your post count must be 10 or greater. You currently have 0 posts. To view links or images in signatures your post count must be 10 or greater. You currently have 0 posts.