responsive landing page using grid and little bit of flexbox

Community feedback

• 

  Dev Rathore•2,600

  @GitHub-dev12345Posted over 2 years ago

  ❤️👍 My small suggestion : 1.In Card design CSS Code Used this:

  transform : scale(0.8); this property decrease the size of card. 😉

  large size for increase the number of scale & small size for decrease the number of scale

  I hope you find this helpful

  1

  ---

  

  Aemro bekalu melaku•510

  @aemrobePosted over 2 years ago

  @GitHub-dev12345 for which class or element should I apply the transform property and I want to ask one question also how do I overcome the accesibility issue? the report section bugged me

  0
• 

  Naveen Gumaste•10,480

  @NaveenGumastePosted over 2 years ago

  Hello Aemro bekalu melaku ! Congo 👏 on completing this challenge

  Let's look at some of your issues, shall we:

  • Links must have discernible text

  • Learn more on accessibility issues

  happy Coding😀

  0

  ---

  

  Aemro bekalu melaku•510

  @aemrobePosted over 2 years ago

  @Crazimonk I don't understand what discernible text mean. can you explain it morebecause for this challenge the link is icon not a text so I don't understand how should I apply it .

  0

  

  Naveen Gumaste•10,480

  @NaveenGumastePosted over 2 years ago

  @aemrobe This method of yours is not good practice

    <aside class="media-icon">
              <h2>hey</h2>
              <ul>
                  <li class="facebook">
                      <a href="https://www.facebook.com/amro.abeham">
                      <span class="icon facebook-icon">
                        <i class="fab fa-facebook-f "> </i>
                      </span>
                      </a>
                  </li>
                  <li class="twitter"><a href="https://twitter.com/Aemro112">
                      <span class="icon twitter-icon">
                          <i class="fab fa-twitter"></i>
                      </span>
                     </a></li>
                  <li class="camera"><a href="https://www.instagram.com/aemrobekalu111/">
                      <span class="icon instagram-icon">
                          <i class="fab fa-instagram"></i>
                      </span> </a></li>
              </ul>
          </aside> 
  

  • Try this method

  <div class="social">
      <div class="social-wrapper">
  	<div class="social-item">
  	     <a href="#" target="_blank"><ion-icon name="logo-facebook"></ion-icon></a>
  	</div>
  <div class="social-item">
         <a href="https://twitter.com/crazi_monk" target="_blank"><ion-icon name="logo-twitter"></ion-icon></a>
  	</div>
  <div class="social-item">
  	<a href="https://github.com/Crazimonk" target="_blank"><ion-icon name="logo-instagram"></ion-icon></a>
  	</div>
  		</div>
  			</div>
  

  0