Frontend recruitment quiz

What is your first and last name ?

What is the difference between the margin and padding properties?

Margin adds space around and inside of an element; padding adds space only inside of an element.

Margin adds space around an element; padding adds space inside of an element.

Margin adds a line around an element, padding adds space inside of an element.

Margin adds space inside of an element, padding adds space around an element.

What is the rem unit based on?

The rem unit is relative to the font-size of the p element.

You have to set the value for the rem unit by writing a declaration such as rem { font-size: 1 px; }

The rem unit is relative to the font-size of the containing (parent) element.

The rem unit is relative to the font-size of the root element of the page.

What is the difference between DEFER and ASYNC in script tags?

Async script loads in background (non blocking) and defer script loads synchronously

Defer script loads in background and async script loads synchronously

Both load in the background, async is executed independently, as soon as is available and defer is executed after page content has been parsed.

Both load in the background, both are executed after page content has been loaded but defer is used for ES6 scripts

Why would you use an attribute 'srcset' in an image tag?

To serve different images to users depending on their device

To lazy load the image

To avoid jumping the image while loading

To set fixed size of the image

The value of which box-sizing property specifies that element size is defined by adding the border, padding and height/width together to define the size of the box?

Padding-box

None

Border-box

Content-box

CSS grid introduced a new length unit, fr, to create flexible grid tracks. Referring to the code sample below, what will the widths of the three columns be?

.grid {
display: grid;
width: 500px;
grid-template-columns: 50px 1fr 2fr;
}

The first column will have a width of 50px. The second column will be 50px wide and the third column will be 100px wide.

The first column will have a width of 50px. The second column will be 150px wide and the third column will be 300px wide.

The first column will have a width of 50px. The second column will be 300px wide and the third column will be 150px wide.

The first column will have a width of 50px. The second column will be 500px wide and the third column will be 1000px wide.

Which operator should be used for comparisons without implicit type conversion in JavaScript?

===

== and ===

What are Javascript scope types?

Block, Function, Class

Block, Function, Global

Function, Global, Class

Class, Block, Global

Which tool should be used to analyse JavaScript code according to predefined quality standards?

Prettier

Webpack

Eslint

Babel

How to improve CLS ?

Use CDN to improve load times.

Optimise images

Decrease bundle sizes

Limit unexpected movement of page content

Which attribute includes HTML element in tab navigation ?

Aria-focusable="true"

Tabindex="0"

Aria-controls="tab"

Tabindex="-1"

Why do we use module bundlers ?

Frontend recruitment quiz

More Quizzes