Responsive Landing Page Using CSS Flexbox

Community feedback

• 

  Jhonatan•90

  @JhonyDomingos

  Posted over 2 years ago

  Hey congratulations for your solution.. Hey I have some tips if you wanna test for your solution

  1. Adding to the body min-height 100vh the elements should occupy the web browser viewport height.

  2. .container you add text-aling:center; set the width with a value in rem not in %, I think 18.5rem will awsome, you can declare margin 30px to the top and auto ex:. margin:30px(top) auto;

  3. h1 do not need a width and you can declare the padding like this padding:(top)20px (right)30px (left)30px 0(bottom); and check this padding I think it's a little too much, I think the padding 15px its enough

  4. p tag I think you can remove the paddings because already and put in the container it will be aplied to h1 and p tags

  5. on .img do not need the height:100% and you can add max-width:100% and set the width:100% and check the paddings maybe you won't need them

  6. You can change all the sizes px to rem to resize better when the screen gets smaller

  I think that's all!!! there are a few tips that can improve on your solution!! I'm here to help anything, I'm gald in help ya !!! if it was useful for ya I'll be glad

  11

  Marked as helpful
• 

  mahmmoud•180

  @mahmmoud5

  Posted over 2 years ago

  if you want to use the mobile and desktop viewport you can use " @media not|only mediatype and (expressions) { CSS-Code; } " or you can search on google about responsive websites and then you will find the answer for you'r question.

  00