25 lines
4.3 KiB
Markdown
25 lines
4.3 KiB
Markdown
---
|
|
title: CSS Flexbox
|
|
localeTitle: CSS Flexbox
|
|
---
|
|
## CSS Flexbox
|
|
|
|
Этот набор проблем научит вас основам использования гибких контейнеров. Задачи:
|
|
|
|
1. [Используйте дисплей: flex to Position Two Boxes](https://github.com/freecodecamp/guides/tree/master/src/pages/responsive-web-design/css-flexbox/use-display-flex-to-position-two-boxes/index.md) .
|
|
2. [Добавить Flex Superpowers к вставке Tweet](https://github.com/freecodecamp/guides/tree/master/src/pages/responsive-web-design/css-flexbox/add-flex-superpowers-to-the-tweet-embed/index.md) .
|
|
3. [Используйте свойство flex-direction для создания строки](https://github.com/freecodecamp/guides/tree/master/src/pages/responsive-web-design/css-flexbox/use-the-flex-direction-property-to-make-a-row/index.md) .
|
|
4. [Примените свойство flex-direction для создания строк в Embed](https://github.com/freecodecamp/guides/tree/master/src/pages/responsive-web-design/css-flexbox/apply-the-flex-direction-property-to-create-rows-in-the-tweet-embed/index.md) .
|
|
5. [Используйте свойство flex-direction для создания столбца](https://github.com/freecodecamp/guides/tree/master/src/pages/responsive-web-design/css-flexbox/use-the-flex-direction-property-to-make-a-column/index.md) .
|
|
6. [Примените свойство flex-direction для создания столбца в Embed](https://github.com/freecodecamp/guides/tree/master/src/pages/responsive-web-design/css-flexbox/apply-the-flex-direction-property-to-create-a-column-in-the-tweet-embed/index.md) .
|
|
7. [Выровнять элементы Используя свойство justify-content](https://github.com/freecodecamp/guides/tree/master/src/pages/responsive-web-design/css-flexbox/align-elements-using-the-justify-content-property/index.md) .
|
|
8. [Используйте свойство justify-content в Tweet Embed](https://github.com/freecodecamp/guides/tree/master/src/pages/responsive-web-design/css-flexbox/use-the-justify-content-property-in-the-tweet-embed/index.md) .
|
|
9. [Выравнивание элементов Использование свойства align-items](https://github.com/freecodecamp/guides/tree/master/src/pages/responsive-web-design/css-flexbox/align-elements-using-the-align-items-property/index.md) .
|
|
10. [Используйте свойство align-items в Tweet Embed](https://github.com/freecodecamp/guides/tree/master/src/pages/responsive-web-design/css-flexbox/use-the-align-items-property-in-the-tweet-embed/index.md) .
|
|
11. [Используйте свойство flex-wrap для обертывания строки или столбца](https://github.com/freecodecamp/guides/tree/master/src/pages/responsive-web-design/css-flexbox/use-the-flex-wrap-property-to-wrap-a-row-or-column/index.md) .
|
|
12. [Используйте свойство flex-shrink для сжимания элементов](https://github.com/freecodecamp/guides/tree/master/src/pages/responsive-web-design/css-flexbox/use-the-flex-shrink-property-to-shrink-items/index.md) .
|
|
13. [Используйте свойство flex-grow для расширения элементов](https://github.com/freecodecamp/guides/tree/master/src/pages/responsive-web-design/css-flexbox/use-the-flex-grow-property-to-expand-items/index.md) .
|
|
14. [Используйте свойство flex-basis для установки начального размера элемента](https://github.com/freecodecamp/guides/tree/master/src/pages/responsive-web-design/css-flexbox/use-the-flex-basis-property-to-set-the-initial-size-of-an-item/index.md) .
|
|
15. [Используйте свойство flex Shorthand](https://github.com/freecodecamp/guides/tree/master/src/pages/responsive-web-design/css-flexbox/use-the-flex-shorthand-property/index.md) .
|
|
16. [Используйте свойство «Заказ» для переупорядочения элементов](https://github.com/freecodecamp/guides/tree/master/src/pages/responsive-web-design/css-flexbox/use-the-order-property-to-rearrange-items/index.md) .
|
|
17. [Используйте свойство align-self](https://github.com/freecodecamp/guides/tree/master/src/pages/responsive-web-design/css-flexbox/use-the-align-self-property/index.md) . |