Skip to content
OverviewSolutions
7
Comments
3
RyanDillon94
@RyanDillon94

All comments

  • RyanDillon94•80
    @RyanDillon94Posted 7 months ago

    Hello!

    Just looking through your code and it seems like you have a lot of copy and paste for your @media queries. If your styles are going to be the same for all screen sizes then you don't need them in two separate media queries, you can just have them in your main CSS file as a base style and use the @media query for styles that are going to change when you scale up/down.

    It also looks like your trying to center your content by using top: 50% and margins which hasn't worked if that's what you were going for... Next time try using display: flex; justify-content: center; and align-items: center; on the parent div.

    I'm just a bit of a newbie myself so I hope that all makes sense!

    Marked as helpful
    0
  • Carisa Elam•100
    @carisaelamSubmitted 7 months ago
    What are you most proud of, and what would you do differently next time?

    Happy to have figured out most of the JavaScript on my own with just a little help from the internet.

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

    It took me a little bit to figure out how to order the code so that the plus and minus signs would switch appropriately and would line up with when the answers were shown.

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

    Couldn't figure out the best way to set media queries for this one for a good user experience. I felt like I just ended up selecting something I thought looks nice. What are the methods to finding "break points?"

    My particular issue was figuring out when to switch the background images from the mobile version to the desktop version in a way that wouldn't be too jarring for a user.

    Responsive design accordion

    2
    RyanDillon94•80
    @RyanDillon94Posted 7 months ago

    Great solution, looks very neat!

    Media queries are new to me so I can't really provide much feedback on those unfortunately. I just went with max-width: 700px for the mobile views which seemed to fit best using viewpoints from Chrome's dev tools.

    I do have a question though... Why did you chose to use JavaScript for the content? I've never seen that before (newbie hobbyist) so very curious! Also the JS script looks very complicated and possibly over-engineered? Very impressive none the less! Mine was just a simple event listener and classList toggle 🤣

    0
  • RyanDillon94•80
    @RyanDillon94Posted 7 months ago

    Almost identical! Awesome work :D

    0