0% found this document useful (0 votes)
54 views

CSS3 Flexbox Concepts

Flexbox is a new layout mode in CSS3 that allows elements to behave predictably across different screen sizes and devices. It provides an improvement over the block model by not using floats and preventing margins from collapsing. Flexbox consists of flex containers and flex items, with the container determining how flex items are laid out along a flex line inside the container.
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
54 views

CSS3 Flexbox Concepts

Flexbox is a new layout mode in CSS3 that allows elements to behave predictably across different screen sizes and devices. It provides an improvement over the block model by not using floats and preventing margins from collapsing. Flexbox consists of flex containers and flex items, with the container determining how flex items are laid out along a flex line inside the container.
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 1

CSS3 Flexbox

Flexible boxes, or flexbox, is a new layout mode in CSS3.


Use of flexbox ensures that elements behave predictably when the page layout must
accommodate different screen sizes and different display devices.
For many applications, the flexible box model provides an improvement over the block model in
that it does not use floats, nor do the flex container's margins collapse with the margins of its
contents.

Browser Support
The numbers in the table specify the first browser version that fully supports the feature.
Numbers followed by -webkit- or -moz- specify the first version that worked with a prefix.

CSS3 Flexbox Concepts


Flexbox consists of flex containers and flex items.
A flex container is declared by setting the display property of an element to either flex
(rendered as a block) or inline-flex (rendered as inline).
Inside a flex container there is one or more flex items.
Note: Everything outside a flex container and inside a flex item is rendered as usual. Flexbox
defines how flex items are laid out inside a flex container.
Flex items are positioned inside a flex container along a flex line. By default there is only one
flex line per flex container.

You might also like