Screen management html css for laptop , mobile , tablet





Laptop screen

@media only screen and (min-width: 1290px) and (max-width: 2000px){ .search-container { padding: 150px 0; } .new-form-control { width: 44.5% !important; background-position: 95% 20px; !important } }
 
 @media only screen and (min-width: 990px) and (max-width: 1289px) { .search-container { padding: 150px 0;!important } .new-form-control { width: 43% !important; background-position: 95.5% 20px; !important} }


tablet screen

@media only screen and (min-width: 768px) and (max-width: 989px) { .search-container { padding: 100px 0; } .new-form-control { width: 43% !important; background-position: 95% 20px; !important } }


mobile screen
 @media only screen and (min-width: 480px) and (max-width: 767px) { .search-container { padding: 100px 0; } .new-form-control { width: 100% !important; margin:0px 0px 10px 0; background-position: 95% 20px; !important } }



@media only screen and (max-width: 479px){ .icons{font-size: 30px;} .fname{font-size:3vw;} .search-container { padding: 100px 0; } .new-form-control { width: 100% !important; margin:0px 0px 10px 0; background-position: 95% 20px; !important } } .new-full-time{ color: white !important; font-weight: bold; padding: 5px; } .new-full-time-high{ color: white !important; font-weight: bold; padding: 0px 4px; }

Comments