@deanrivers
Submitted
- Getting it responsive nicely.
- The media query. Maybe there is a better way.
- Would like some tips on setting up classes to keep css industry standard for something like this.
Muhammad Bilal
@mbilal-x
All comments
- Muhammad Bilal• 160
@mbilal-x
Posted
Hi Dean!
Congratulations on completing you first challenege here.
here is some feedback and answer to you question:
-
media queries are the most fundamental way to make you code responsive, getting a hang of it is always good before moving on to using CSS frameworks like bootstrap and tailwind.
-
A well know and accepted method for naming your CSS classes is the
BEMnaming system. you can look that up. -
and yes I see you have added your styles in the same html file. Try using a separate styles.css file and link it to you html. This is more useful and scalable approach .
Hope this helps, goodluck
Marked as helpful
1 -
@themegazord
Submitted
Muhammad Bilal• 160@mbilal-x
Posted
Hi Gustavo!
I have seen your design... your design breaks between
375pxand800px. To fix this you can change you@media (max-width: 375px)to@media(max-width: 800px). Then inside this same media query add to.content{ max-width: 375px; }- For your future designs look into mobile first designing mobile first code
-> Congratulations!! on your first challenge here. Goodluck on your frontend journey.
1- Simen Hagen• 90
@SimenHagen86
Submitted
All feedback would be appreciated, struggled alot with the desktop view, also what parent etc to put flex on.
so any tips on layout is welcome
Muhammad Bilal• 160@mbilal-x
Posted
Hi Simen! I see you have used flex on the main tag. I what I did was to put flex on the body and then I used a div.panelContainer inside the body. so the div is now centered and I then put my image and text inside the .panelContainer [which also is a flexbox]
Marked as helpful
0
