Responsive landing page using css-grid,flexbox,bootstrap and js

Community feedback

• 

  Ahmed El_Bald•1,020

  @Ahmed-ElbaldPosted 11 months ago

  Hi Alain,

  1.Concerning the dropdown menu issue, your main problem is that you are giving the div.dropdown a position: relative, which makes your dropdown tied to that div. Instead remove the position: relative, and try to center the dropdown using left: 50%; transform: translate(-50%); with some padding. For more info on how to implement that, Consider having a look at my solution

  2.I've noticed that your navigation links are not wrapped in a a element, which is bad regarding the functionality and accessibility of the app. So, instead of <li>Home</li>, try something like <li><a href='/home'>Home</a></li>

  3.You should edit your headings (h1, h2, h3, ...) a little bit. You can not have an h6 and then an h4 right after that like in the article cards. In fact, text like, By Claire Robinson should not be a heading. It's more like a subtitle. In your markup, you can place it after the main heading (the article title) and then reverse their order in the layout using the order property.

  I hope you find that helpful.

  Marked as helpful

  1