Advice Generator app with API

Solution retrospective
Issue with the icon dice fixed. New hovering states animation added.
Please log in to post a comment
Log in with GitHubCommunity feedback
- @Zy8712
Hi there! To answer your question: In order to position the divider and the dice button you should use
position: absolute
on them. Then you should useposition: relative
on their parent which in this case is the div with class.container
. Then you can use thebottom
css property to position it. Read more aboutposition: absolute
here and more about bottom here.Some other things I noticed when testing you site and reading you code:
- the dice button doesn't cause the advice text to be replaced
<footer>
tags should mainly be used for things at the very bottom of web-pages and aren't apart of the page's main content<section>
tags should mainly be used for long webpages with different sections, each with different topics- you should replace the
<footer>
and<section>
tags with standard<div>
tags
Hope you find this feedback useful 👍
Marked as helpful
Join our Discord community
Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!
Join our Discord