3 column preview challenge. HTML and CSS

Community feedback

• 

  Raymart Pamplona•16,100

  @pikapikamartPosted over 3 years ago

  Hey, great work on this one. The layout is kind of big compared to the original but preferences right. It resizes well when going in mobile state and no scrollbar at the bottom which is good.

  I see that you are transitioning the border in those learn more buttons. But as you can see, when you hover on it. It adds a space right, thus resizing a little the container.

  To fix those, what you want to do is that, you initially set a border in your button elements. Declaring like this border: 2px solid transparent, then in your hover state you just transition the border-color:

    button: hover {
      border-color: #FFFFFF;
  }
  

  This way, it won't add any extra space when hovering and preventing those scaling container.

  Overall, you did a really good job in your solution. I haven't done any mobile first so can't any give any advice on that one :>>

  0

  ---

  

  Jenna•125

  @jamby4546Posted over 3 years ago

  @pikamart thank you! i thought about the border issue but i didn't know you could initially set it to transparent and i just cobbled it together the best i could.

  0