HTML CSS GRID

Community feedback

• 

  T

  Chamu•13,130

  @ChamuMutezvaPosted about 3 years ago

  • one of the issue raised Document should have one main landmark can be fixed by having a main element. Eliminate using divs where possible in favour of semantic html
  • the following represents a nav list

  <ul>
            <li class="l1">Features</li>
            <li class="l1">Team</li>
            <li class="l1">Sign In</li>
          </ul
  

  Let features, team and sign in be anchor elements

  • an input element must be associated with a label for accessibility reasons
  • write your words in lowercase <button type="submit" id="btn-1">GET STARTED</button> , uppercase words are read letter by letter . Use css to transform words to uppercase
  • use only one h1 element. let the headings ascend in order without skipping headings - h1, h2 , h3 etc
  • The only permitted child of a list (ul or ol) is an 'li` element. the following from your code is incorrect

   <ul>
                <img src="./images/icon-phone.svg" alt="">
                <li id="in1">Phone: +1-543-123-4567</li>
                <img src="./images/icon-email.svg" alt="">
                <li id="in1">[email protected]</li>
              </ul>
  

  images cannot be direct children of ul

  Go through you code again, there are several issues that needs fixing . The above are just a random selection from your html

  Marked as helpful

  1

  ---

  

  Kurt Gonzales•300

  @KurtGonzalesPosted about 3 years ago

  @ChamuMutezva Thank you! I really appreciate it.

  0
• 

  Ahmed Faisal•5,095

  @afrusselPosted about 3 years ago

  Use flexboxgrid.css library if you are not comfortable to handle media queries for all device supported code. I think please manage some time and go through flexbox tutorials to understand grid and flex behaviour

  Marked as helpful

  0

  ---

  

  Kurt Gonzales•300

  @KurtGonzalesPosted about 3 years ago

  @afrussel Thank you for the tips!

  0