Skip to content
Submitted 16 days ago

Article Component with Popup

P
turtlewords•160
@Turtlewords
Preview site (opens in new tab)View code (opens in new tab)
This is a solution for...Article preview component
  • HTML
  • CSS
  • JS
1newbie

Design comparison

SolutionDesign

Solution retrospective

What are you most proud of, and what would you do differently next time?

The popups came out relatively well and function properly. Next time, I might include some sort of animation when the popup activates.

What challenges did you encounter, and how did you overcome them?

Placement of the main image was a challenge. I ended up using the image as the background of a div. This way, I was able to position the image as needed.

What specific areas of your project would you like help with?

Please take a look at image position as well as element spacing. Thank you.

Community feedback

  • P
    Waldemar Glaz•845
    @waldekglazPosted 16 days ago

    Hi @Turtlewords, you could wrap your image and text area in one container:

    <parent>
    <img>
    <text>
       <nested text>
       <><>
    </text>
</parent>

    set parent to flex with direction column on mobile and row on bigger screens. Try also to focus on responsiveness and avoid in this case vh and try px, em or rem.

    0

Please log in to post a comment

Log in with GitHub

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