Advice Generator with React/Typescript and tailwind-css

Community feedback

• 

  Ruben•550

  @RubenSmnPosted almost 2 years ago

  Hi Nico, I just looked at your solution for the Advice generator app and the desktop version looks really good. But when I switch to mobile the width of the div is not responsive.

  I see in your code you're using Tailwind CSS and have a specific desk break point. You could add a default width of something like 80% to the container div.

  <div
    className="w-[80%] bg-c-dark-grayish-blue relative m-5 p-5 rounded-xl flex flex-col justify-center items-center gap-5 desk:w-[33%] desk:gap-8 desk:px-10"
  >
    ...
  </div>
  

  I also used Tailwind CSS for this. If you want reference something take a look at my solution

  Marked as helpful

  1