Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

Easybank landing page

#accessibility
enzmrg πŸ’«β€’ 870

@enzo-mir

Desktop design screenshot for the Easybank landing page coding challenge

This is a solution for...

  • HTML
  • CSS
  • JS
3intermediate
View challenge

Design comparison


SolutionDesign

Solution retrospective


πŸ•“β‰ˆ 4h

Community feedback

Ahbideen Yusufβ€’ 160

@bravono

Posted

Hi Enzmrg

Great job!

Something that stood out when I looked at your solution was the position of the phone mockup. I can see that is behind the "Why Choose Easybank" component.

The property you need to fix this problem is the "position: absolute" property. Note that the parent container has to be set to "position: relative". With these changes, you should be able to position your mockup however you like.

Also, note that it can be challenging to get it right even with the property I just mentioned.

I almost forgot that you also need to set the "z-index: 999". The 999 is arbitrary but you want to set it to a high number to make sure that the mock moves ontop.

I hope this helps!

Marked as helpful

0

enzmrg πŸ’«β€’ 870

@enzo-mir

Posted

@bravono Thanks ! I forgot this, I didn't see my preview thanks you !

1
enzmrg πŸ’«β€’ 870

@enzo-mir

Posted

@bravono I fixed it πŸ‘

1
Ahbideen Yusufβ€’ 160

@bravono

Posted

Awesome! @enzo-mir

I don't mind a follow πŸ˜‰

1

Please log in to post a comment

Log in with GitHub
Discord logo

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