My solution

Community feedback

• 

  Szymon Rojek•4,540

  @SzymonRojek

  Posted over 4 years ago

  Hi Yuniac,

  Good job! :D

  I have checked your project by the inspector, a few tips for me:

  • remove this <div class="container"> and create the main tag with the class;
  • generally you have used so many unnecessary nested divs (try to change it);
  • inside of the main tag I could use the section tag, and then three divs for these three boxes;
  • about this code below:

  div class="wrapper sub-price"><span class="dollar-sign">$29</span><span id="permonth">per month</span></div>
  

  Instead of this div you I'd recommend using the p tag with two spans (ID's are unnecessary here => it is good to use them with JS); Below will be the *p tag with this text: Full access for less than $1 a day

  • what do you think about the link instead f a button? (this on click doesn't have to be here);
  • third box: Why us => you can use the h2 tag;

  Design:

  • check your project on different devices by the inspector in your browser, there is lots of to do: play with the size of the text, margin (especially the top, right, left), padding, the footer;
  • text in the first box: these two paragraphs under the green color text should be on mobile treat as a one text but later you can get this solution => separate sentences one under each other;
  • per month: color of this text is not very well (check the design file);
  • this is single page component so you can add overflow hidden to the body (eliminate the scroll);
  • the bg-color of the third box: I gave them the same color for the second and third box but additionally I have added pseudo-element after to the third box with the gray color => I called it "overlay";

  That's from me.

  Greetings :D

  16