Landing page using Html , Css

Community feedback

• 

  Ambe Mbong-Nwi Nchang•550

  @Ambe-Mbong-NwiPosted almost 2 years ago

  .container{
        display: grid;
        grid-template-columns: repeat(2, 1fr);          /*creating two columns of equal width*/
        grid-template-rows: 40px 100px;      /*widths of your two rows you can increase them*/
        grid-gap: 20px;
        max-width: 1224px;           /*max-width of grid*/
        margin: 0 auto;
       grid-template-areas:
      "right-bar free-trial"
      "right-bar register";       /*this placement shows how the different elements will be on the grid*/
  }
  /*defining your grid areas*/
  .right-bar{
         grid-area: right-bar; }
  .free-trial{
         grid-area: free-trial; }
  .register{
         grid-area: register; }```
  

  Marked as helpful

  1
• 

  Ambe Mbong-Nwi Nchang•550

  @Ambe-Mbong-NwiPosted almost 2 years ago

  Preferably, you can use CSS grid by displaying the class container as grid. Then create two rows and two columns so your items on the right bar occupy the first column and two rows while the items on the left bar occupy a row each.

  Marked as helpful

  1