home
Naukri Code 360
expand-more
Web development projects & problems
expand-more
CSS Grid 'auto' Column
CSS Grid 'auto' Column
CSS styling
What are competencies?
EXP:
40

CSS Grid 'auto' column

In CSS Grid, grid-template-columns: auto fixed-value; defines a layout where one column adapts to content size, while the other maintains a fixed width.

Initial CSS for this problem is already written for you. Your task in this problem is to apply css as per the instruction table below. This will result in the layout as shown in the screenshot.

S. no Problem
1 apply width of 600px to div.container
2 make .container element a grid container
3 .container element should have its first column to be flexible while its second column to be 200px

INSTRUCTIONS

CSS Selector CSS Styling
div.container width : 600px
display grid
grid-template-columns : auto 200px





    - Final

    React



    Evaluation
    • After submission, your solution will be evaluated automatically based on the tasks defined above.
    • Upon successful completion of all the tasks/requirements, you will get a full score, and there will not be any partial scoring.
    • You can work on your failed test cases & resubmit your solution.
    • Your problem will get evaluated instantly.

    Do’s & don’t
    • Use the given code structure in editor and do not make any changes.
    • Do not modify existing classes or tags.
    • Focus on correct HTML structure and class names.

    Query & feedback
    • In case of any query/feedback on this project, please fill this form & we will soon get in touch with you to resolve.

    Best of luck, developers!