Skip to content
Submitted about 4 years ago

Article Preview Page

hallux•35
@haIIux
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

Unfortunately I am struggling on making this responsive at all. Any attempts at media queries failed to work. I would love to know what I need to do / change to make it responsive aside from using a CSS framework such as Bootstrap.

Community feedback

  • Emmilie Estabillo•5,540
    @emestabilloPosted about 4 years ago

    Hi @haIIux, have you tried flex-direction: column on .contentBox? The divs should stack as expected.

    1
    hallux•35
    @haIIuxPosted about 4 years ago

    @emestabillo thank you! That did the trick, now I just have to figure out how to properly align the share pop up.

    0
  • Kaspar Jõeveer•45
    @DishockPosted about 4 years ago

    This comment was deleted over 3 years ago

    0
    hallux•35
    @haIIuxPosted about 4 years ago

    @Dishock I did attempt that with media queries but no matter what I attempted to change, it failed to change. I am using flexbox so I attempted to just simply change the container direction and had no luck.

    1
    Michael Solomon•180
    @MichickoPosted about 4 years ago

    @haIIux Choose a break point for the mobile view and then change the flex-direction to column. You can then start adjusting to your taste.

    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