freeCodeCamp/use-display-flex-to-position-two-boxes.russian.md at ba6ae7154c0abf583ec2fb5f33557fd29b5e791f

Files

Ivan Gretsky 762dccffcc Update Russian translation for use-display-flex-to-position-two-boxes.russian.md (#33455 )

* Update translation for use-display-flex-to-position-two-boxes.russian.md

* Make title sound more polite in Russian

2019-04-25 00:10:25 -07:00

2.1 KiB

Raw Blame History

id, title, challengeType, videoUrl, localeTitle

id	title	challengeType	videoUrl	localeTitle
587d78ab367417b2b2512af0	Use display: flex to Position Two Boxes	0		Используйте display: flex для позиционирования двух прямоугольников

Description

Задачи этого раздела призваны научить использовать CSS для "гибкого" позиционирования элементов. Вначале будет объяснена теорию. Затем нужно будет практически применить концепцию flexbox для оформления простого компонента твита. Применение CSS свойства display: flex; к элементу позволяет затем использовать другие свойства flex для создания отзывчивого дизайна страницы.

Instructions

Добавьте CSS свойство display элементу #box-container и установите его значение равным flex.

Tests

tests:
  - text: 'Для элемента <code>#box-container</code> должно быть задано свойство <code>display</code> со значением flex.'
    testString: 'assert($("#box-container").css("display") == "flex", "<code>#box-container</code> should have the <code>display</code> property set to a value of flex.");'

Challenge Seed

<style>
  #box-container {
    height: 500px;

  }

  #box-1 {
    background-color: dodgerblue;
    width: 50%;
    height: 50%;

  }

  #box-2 {
    background-color: orangered;
    width: 50%;
    height: 50%;

  }
</style>
<div id="box-container">
  <div id="box-1"></div>
  <div id="box-2"></div>
</div>

Solution

// solution required

2.1 KiB Raw Blame History Unescape Escape