Go on. Explore!

lvl 0 • 0 xp

lvl 1

Home Market Decks Interests

Chapter 9 Fundamentals of Web Programming

memorize.ai (lvl 286)

(0)

19 cards

()

Section 1

Preview this deck

A flex container can contain one or more

Front

1 / 19

Web Dev

0.0

0 reviews

5			0
4			0
3			0
2			0
1			0

Active users

All-time users

Favorites

Last updated

6 years ago

Date created

Mar 1, 2020

Cards (19)

Section 1

(19 cards)

A flex container can contain one or more

Front

Flex Items

Back

What CSS property do you use to determine whether flex items are displayed horizontally or vertically?

Front

flex-direction

Back

By default, if the flex items within a flex container are too wide to fit within the container

Front

the sizes of the flex items will be reduced as much as possible and the content will be wrapped within the flex items

Back

What is another way to write the CSS that follows? section { flex-basis: 500px; flex-grow: 3; flex-shrink: 1; }

Front

a. section { flex: 3 1 500px; } b. section { flex: 500px 1 3; } c. section { flex: 500px 3 1; } d. section { flex: 1 3 500px; } A. is Correct

Back

By default, the items in a flex container are displayed

Front

Horizontally from left to right

Back

If the items within a flex container are displayed in a row and you want an equal amount of space to be allocated between the flex items, before the first flex item, and after the last flex item, you should set the justify-content property to

Front

Space-evenly

Back

<main> <aside>Sidebar</section> <section>Content</section> </main> (Refer to code example 9-1) Given the CSS that follows, what will the width of the section element be if the width of the main element is 1000 pixels? main { display: flex; } section { flex-basis: 400px; flex-grow: 2; } aside { flex-basis: 300px; flex-grow: 1; }

Front

a. 600 pixels b. 800 pixels c. 700 pixels d. 500 pixels A. is Correct

Back

If the flex items in a container are displayed in a row, how are the items aligned vertically by default?

Front

extending from the top to the bottom of the container

Back

Flexbox provides for laying out elements side by side

Front

without using floats

Back

By default, the items in a flex container are displayed in the order they appear in the HTML. What property do you use to change this order?

Front

Order

Back

What CSS property do you use to override the alignment of a single flex item along the cross axis?

Front

align-self

Back

If the flex items in a container are displayed in a row, how are the items aligned horizontally by default?

Front

at the start of the container

Back

You use the justify-content property to align the flex items in a container

Front

along the main axis

Back

The flex direction determines how flex items are laid out along the

Front

main axis

Back

If the items within a flex container are displayed in a row and you want an equal amount of space to be allocated between the flex items but you don't want any space before the first flex item or after the last flex item, you should set the justify-content property to

Front

Space-Between

Back

<main> <aside>Sidebar</section> <section>Content</section> </main> (Refer to code example 9-1) Which of the following media queries would you use to change the layout of the main element to vertical orientation with the section above the sidebar?

Front

a. @media screen and (max-width: 760px) { main { flex-direction: vertical; } section { order: 1; } aside { order: 2; } } b. @media screen and (max-width: 760px) { main { flex-direction: column; } section { sequence: 1; } aside { sequence: 2; } } c. @media screen and (max-width: 760px) { main { flex-direction: column; } section { order: 1; } aside { order: 2; } } d. @media screen and (max-width: 760px) { main { flex-direction: vertical; } section { sequence: 1; } aside { sequence: 2; } } C. is Correct

Back

Flexbox is typically used to lay out

Front

selected components within a web page

Back

<main> <aside>Sidebar</section> <section>Content</section> </main> (Refer to code example 9-1) Given the CSS that follows, what will the width of the section element be if the width of the main element is 800 pixels? main { display: flex; } section { flex-basis: 60%; } aside { flex-basis: 40%; }

Front

480 pixels

Back

What CSS property do you use to display a block element as a flex container?

Front

Display

Back