Mobile-first responsive solution

Hi Francisco, how are you?

I really liked the result of your project, but I have some tips that I think you will like:

1- Page must contain a level 1 header click here

I noticed that the content was not centered, always prefer to center with flex-box or grid.

For example:

removed this one:

.container { /* margin: 150px 10px 0; */ }

I added this:

body { min height: 100vh; }

The rest is great!

Hope it helps...👍

For the button you can use .btn-div { left: 50%; translate: -50%; } This will center your button in the middle of your div

Hi Francisco, I think @K-Zimny gave you some good advice there for centering the dice. You'll also need to make sure the divider has a width: 100% so that the two marks in the divider line up with the dice.

By the way I think how you wrote your data fetching is really great. Right now I'm viewing this on Firefox and it doesn't load the next advice due to caching. If you have Firefox, you can test it out as well. To fix that, add a request header object in fetch, like this:

fetch(url, { cache: 'no-cache' })

Hope some of this can help you out!