What is a responsive website?

UI Developer - Interview Questions

A responsive website can fit in all screen sizes and all devices : laptops, tablets, and mobile phones.

CSS media queries are utilized to rearrange the elements and to hide or display the elements from the UI.

Impliment these following Step in section :

â€‹<meta name="viewport" content="width=device-width,initial-scale=1.0,user-scalable=yes">

Media queries examples :

@media only screen and (min-width:300px) and (max-width:480px){
  .samplefile{
    width:96%;
    padding : 10px;
    margin : 5px auto; 
    background-color: blue; 
  }
}

@media only screen and (min-width:1100px){
 .samplefile{
    width:96%;
    padding : 10px;
    margin : 5px auto; 
    background-color: gray; 
  }
}