how to make a page responsive

Question

I have created an html file but on the my phone it looks weird. the words just cut themselves. eg in a whole page in each line there two word only then they cut themselves to another line.

something like this..
hey am
new in
sololearn
and i am
going
to....

Answer 1

thanks man i used your help and i added
@media (max-width: 400px) {
.main {
white-space: nowrap;
}
}

Answer 2

you will need to use css @media tag:
@media (max-width: 400px) {
  body {
    background-color: lightblue;
  }
};

@media tag do not work unless the condition that you gave it(max width or whatever you want) is true.
max width means the width of the screen

try it on your pc by changing your browser tab size.