Mobile First CSS HTML CSS GRID FLEXBOX

Community feedback

• 

  Raymart Pamplona•16,100

  @pikapikamartPosted over 3 years ago

  Good work on this one.

  Before your query, suggestions.

  1. I see that you added a hover effect in your navbar items, it is fine but we want to make it more great right, right now, when I hover, it pushes it siblings right because you are adding a font-weight to it. Well to get this effect, but smoother, we could make a transition to the transform: scale() styling, so that even when we hover on this, its sibling wont be pushed away because of it.

  2. Button hovering. Right, it is transitioning its background-color right, it transitions to something white, but the thing is that, the foreground text is colored white as well and we don't want that, instead make the text color different, something that will be complemented of the background-color of it, something dark-ish will be great.

  Other than that, personal preferences right.

  In your query regarding the invalid text. Well you could achieved this using javascript, because if we only rely on css, we can make it work but text will still appear. I won't explain it detail by detail but the idea only. But first is that, you may want to prevent the default action when an element is clicked, so checking event.preventDefault() will be great, search for it. Next we could just add a custom html element that will pop out if the email is invalid right that is one thing. But if you just want to customized the appearing text, well you will have to use some API for that like the constraint validation API. It is easy to use here is a link for form validation from MDN.

  If need more help, just drop it here and we are to help, everyone helps everyone in here right^^

  0