Worklit Landing Page - desktop/ tablet/mobile views

Community feedback

• 

  Josue Martinez•140

  @JosueJMartinezPosted about 1 year ago

  Nice work. For your issues about centering on mobility I took a glance real quick glance debugging. I would suggest not to use a lot of 80vh/vw instead use 80% so you take up 80 percent of the parent div. Some your issue is that you want to use 100vw on some children but the parent does not go 100vw so I see alot of overflow. I suggest to look at divs with tags .background-1, .details, and div.test-container.

  For example:

  .background-1 {
    background-color: var(--dark-purple);
    position: absolute;
    border-radius: 0% 0% 10% 10%;
    height: 55vh;
    width:  100%  //100vw;
    z-index: -10;
  }
  

  As for the weird curve border-radius try something like this on the background-1:

    border-bottom-left-radius: 100% 50%;
    border-bottom-right-radius: 100% 50%;
  

  This is just an example where you can control the curve on each side you can play with the numbers I tried 90% 20% and is closer.

  0