The very first step on making your website responsive after putting together content is to add a meta tag with the name attribute set to viewport between your site’s head tags.
The meta tag should look like this,
<meta name="viewport" content="width=device-width, initial-scale=1">
What this meta tag does is to tell the browser to set its viewport to be scaled to fit the screen of the device you’re viewing it on.
In your site’s head tags, this is what it should look like,
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Hello reader!</title>
</head>
<body>
</body>
</html>
Adding this single line to your HTML file will set you up in the right direction to make your website responsive.
