Landing Page Dasar dengan Menggunakan HTML CSS dan Responsive

Community feedback

• 

  P

  Ralph Virtucio•670

  @ralphvirtucioPosted 7 months ago

  Hi Ronx28 ,Great job on this challenge

  • If you want you can set a reset css to your stylesheet this will normalize the default styles and behaviors of HTML elements across different web browsers. Try checking out this articles CSS Tools: Reset CSS and Modern CSS reset by Josh Comeau

  • I'd like to suggest that your HTML code could be improved by refactoring it to a semantic HTML, It's a good practice to always consider using Semantic HTML in your projects because its help the search engines and other user devices to determine the importance and context of web pages. This will make it more easier to read, greater accessibility and better user experience. If you want to learn more about semantic HTML elements you can check this article out

  • I'd like to suggest taking another look at the responsiveness of your project. Currently, it looks good in the desktop layout, but in the mobile size or if you make the size smaller the card's content is overflowing. You might want to use rems, em for this and you might to remove the height in your container. If you want to learn more about best practices for size units in CSS you can check this article out

  • This code <a href=""><div class="tombol">Frontend Mentor</div></a> could be improved by removing the div element and moving the class to the anchor element it will look like this <a href="" class="tombol">Frontend Mentor</a>. if you are worrying the width and height will not work you can set the value of the display property to block.

  • If you want to have a font to be like in the provided design you can put a font-family to the body selector and set it's value to "Inter", sans-serif.

  • If you want to implement the active state you can set a a:hover then put a background-color and color property to the specific requirement. You can check this out on styling the links or anchor element.

  • I'd suggest also updating README-template.md this will provide more information about your project

  **Overall you did great on completing this challenge, Let me know if you have questions. CODE UP 🙌 🙌 🙌 ! ! ! **

  Marked as helpful

  1