All solutions

I am still struggling with mobile responsiveness and initial layout. How can I better lay out my css to be more flexible when changing screen sizes with all the text components in flex boxes?

How am I able to dynamically modify the image src attribute tags for my creations component to change based upon screen size?

How could I have designed this better to be able to handle the media query?

When resizing the window my background image positions do not stay fixed. How can I make the two circles stay positioned relative to the profile card?

Is it best practice to have a section tag to identify the component?

How could I have gotten the proper color to overlay on top of the image to the right?

My alignment is not flexible and thus when the media query section came into account everything became out of alignment. How can I design for this better?

What is a proper naming convention for html id, class?

When copying over media queries can you simply just add the only attribute that changes or must I bring over all attributes apart of that specifier?

What best practices can I change to improve my css and html? I found centering the QR image within the div to be quite difficult. Is their a better way to do this?