Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

Responsive info web

@ppinillos

Desktop design screenshot for the 3-column preview card component coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Community feedback

@brunafelix79

Posted

.columna { color: white; padding: 2rem; width: 40%; overflow: hidden; transition: width .3s ease-in-out; cursor: pointer; height: 400px; }

.columna.activa { width: 40%; }

parabéns, mas tenta ver ai se consegue arrumar o tamanho das colunas

Marked as helpful

0

@ppinillos

Posted

@brunafelix79

add to the exercise a Js script that allows you to click on it to expand the activated column and collapse the others, so "it looks different". by default a column will always look larger than the active one. while the others collapse... check the repostory and in vercel it is displayed!

0

Please log in to post a comment

Log in with GitHub
Discord logo

Join our Discord community

Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!

Join our Discord