Meet-landing-page by Helix34

Community feedback

• 

  P

  DalaScript•530

  @DalaScriptPosted 6 months ago

  Hey, Well Done,

  As I read you had a problem with the header background. -In this project we had a total of 3 image-heroes, one image-hero for mobile and tablet sizes and the other two for desktop screens. I personally did it like this: -HTML : <picture> <source media="(min-width: 768px)" srcset="/image-hero.png" width="820" height="303"> <img class="bg-hero-img" src="" width="414" height="153" alt="image hero"> </picture> <img class="bg-hero left" src="/image-hero-left.png" alt="image hero left"> <img class="bg-hero right" src="/image-hero-right.png" alt="image hero right">

  -CSS : .bg-hero { display: none; } @media only screen and (min-width: 1440px) { .bg-hero-img { display: none; } .bg-hero { display: block; position: absolute; } }

  -Let's try this. Don't forget to give .bg-hero.left and .bg-hero.right top and left properties.

  • Your HTML is semantically justified, but you can refactor the code, for example, add a main element for sections and insert it. • Sizes of images and texts, spaces between containers and texts, button hovers. After fixing all this, your website will be perfect. • Layout looks good, good responsiveness.

  Good Luck

  Marked as helpful

  0

  ---

  

  P

  Helix34•110

  @RVidal34Posted 6 months ago

  Thank you very much for your feedback @NikaDalalishvili. I finish a current project and get on with it.

  Your solution allows cleaner code, it’s great!!!

  1

  

  P

  DalaScript•530

  @DalaScriptPosted 6 months ago

  @HelixX34 Thank you, that gives me even more motivation. Yes gladly! I wish you good luck then!

  1