An Interest In:
Web News this Week
- April 27, 2024
- April 26, 2024
- April 25, 2024
- April 24, 2024
- April 23, 2024
- April 22, 2024
- April 21, 2024
CSS Interview Question: Create Responsive Design (1 Column / 3 Column)
I went on numerous job hunting this year and noticed that most of the interview questions revolve around javascript and it is totally understandable. No CSS/HTML.
Those other interviews that contain CSS technical questions , I was asked to write a responsive layout - 1 column for small screens and 3 columns for wider screens.
Just like any given problems, there are many solutions to this question. Hopefully, you do not present the old way of doing things which is to use table, or float like below .
// CSS Float@media (min-width: 500px) { .column { width: 33.33%; float: left; }}
My recommendation would be either css flexbox or grid which would like below.
// CSS Flexbox@media (min-width: 500px) { .columns { // parent display: flex; } .column { // child flex: 1; }}
// CSS Grid@media (min-width: 500px) { .columns { // parent display: grid; grid-template-columns:repeat(3,1fr); }}
CSS is a skill that needed by every front-end developer/engineer although it is not the favorite skill. One should be able to write elegant and minimal CSS rules.
What is your take on this? Should CSS questions or challenges still be asked on a front end interview or we can assume that engineer should know it as it is not a programming language?
Codepen: https://codepen.io/collection/pgbEQM (If you want to play around these three approaches)
For those who prefers video format
Original Link: https://dev.to/frontendengineer/css-interview-question-create-responsive-design-1-column-3-column-264i
Dev To
An online community for sharing and discovering great ideas, having debates, and making friendsMore About this Source Visit Dev To