Image not floating properly

Hello campers…
Please help me look at my code and see why my image has refused to float properly on a laptop screen.

Here’s the link…

Hey Ugorji,

it’s 2020, there are better tools to use than float, e.g. CSS flexbox.

When I have a look at your project:

  • on a wide screen, the yoga heading is on the left side and an image on the right side
  • on a small screen, the yoga heading is at the top and the image below it.

What is your desired layout?

I styled the small screen first. Making the elements stack on each other which is the normal thing. The layout for a larger screen should be the image by the right side of the header and properly aligned at same height as the heading and paragraph tags.

See the sample page and help me see how I can correct my codes accordingly