diff --git a/curriculum/challenges/russian/01-responsive-web-design/css-flexbox/align-elements-using-the-justify-content-property.russian.md b/curriculum/challenges/russian/01-responsive-web-design/css-flexbox/align-elements-using-the-justify-content-property.russian.md index f4cb17d33a..84c04dcc12 100644 --- a/curriculum/challenges/russian/01-responsive-web-design/css-flexbox/align-elements-using-the-justify-content-property.russian.md +++ b/curriculum/challenges/russian/01-responsive-web-design/css-flexbox/align-elements-using-the-justify-content-property.russian.md @@ -3,21 +3,21 @@ id: 587d78ac367417b2b2512af6 title: Align Elements Using the justify-content Property challengeType: 0 videoUrl: '' -localeTitle: Выравнивание элементов Использование свойства обоснования-содержимого +localeTitle: Выравните элементы используя свойство justify-content --- ## Description -
Иногда элементы гибкости в контейнере flex не заполняют все пространство в контейнере. Обычно хочется сказать CSS, как выровнять и вытеснять элементы flex определенным образом. К счастью, свойство justify-content имеет несколько вариантов для этого. Но во-первых, перед тем, как рассмотреть эти варианты, необходимо понять какую-то важную терминологию. Вот полезное изображение, показывающее строку, иллюстрирующую приведенные ниже концепции. Напомним, что установка гибкого контейнера в виде строки помещает элементы гибкости бок о бок слева направо. Гибкий контейнер, установленный как столбец, помещает элементы гибкости в вертикальный стек сверху вниз. Для каждого направление расположения элементов гибкости называется главной осью . Для строки это горизонтальная линия, проходящая через каждый элемент. А для столбца главная ось - вертикальная линия через элементы. Существует несколько вариантов того, как перемещать элементы гибкости вдоль линии, которая является главной осью. Одним из наиболее часто используемых является justify-content: center; , который выравнивает все элементы гибкости до центра внутри гибкого контейнера. Другие варианты включают:
+
Иногда flex элементы в контейнере flex не заполняют все пространство в контейнере. Обычно хочется сказать CSS, как выровнять и раздвинуть элементы flex определенным образом. К счастью, свойство justify-content имеет несколько вариантов для этого. Но сначала, перед тем, как рассмотреть эти варианты, необходимо понять важную терминологию. Вот полезное изображение, показывающее строку, иллюстрирующую приведенные ниже концепции. Напомним, что установка flex контейнера в качестве строки помещает flex элементы бок о бок слева направо. Flex контейнер, установленный в качестве столбца, размещает flex элементы вертикально сверху вниз. Направление расположения flex элементов называется главной осью . Для строки это горизонтальная линия, проходящая через каждый элемент. А для столбца главная ось - вертикальная линия через элементы. Существует несколько вариантов того, как перемещать flex элементы вдоль линии, являющейся главной осью. Одним из наиболее часто используемых является justify-content: center; , который выравнивает все flex элементы по центру внутри flex контейнера. Другие варианты включают:
## Instructions -
Пример помогает показать это свойство в действии. Добавьте свойство justify-content CSS в элемент #box-container и присвойте ему значение центра. бонус
Попробуйте другие параметры для свойства justify-content в редакторе кода, чтобы увидеть их различия. Но обратите внимание, что значение центра является единственным, которое пройдет эту задачу.
+
Пример помогает показать это свойство в действии. Добавьте свойство justify-content CSS в элемент #box-container и присвойте ему значение center. Бонус
Попробуйте другие параметры для свойства justify-content в редакторе кода, чтобы увидеть их различия. Но обратите внимание, что значение center является единственным, которое пройдет эту задачу.
## Tests
```yml tests: - - text: 'Элемент #box-container должен иметь свойство justify-content заданное значением центра.' + - text: 'Элемент #box-container должен иметь свойство justify-content заданное значением center.' testString: 'assert($("#box-container").css("justify-content") == "center", "The #box-container element should have a justify-content property set to a value of center.");' ```