task3.css

/* эта часть для удобства, её тоже можно менять */
.first, .second, .third {
  width: 100%;
  height: 600px;
  border: 1px solid red;
  padding: 10px;
  font-size: 1.5em;
}

.first * {
  display: inline-block;
  /* этот кусок использован, чтобы сбросить значения свойства display по умолчанию
  Не убирайте его, и каждому элементу пропишите подходящее ему свойство display*/
  
}

/* первое задание */
.first span {
  display: block;
  height: 100px;
  width: auto;
  font-style: italic;
  color: orchid;
}

.first p {
  /* Элемент <p> является блочным элементом
  и по умолчанию имеет значение  display: block; 
  К данному элементу применено свойства
  display: inline-block; которое в свою очередь
  позволяет задавать ширину и высоту данного блока, но и без
  применения свойства display: inline-block; также можно 
  задвать высоту и ширину блока.
  В данном случае display: inline-block; не имеет ни какого эфекта.
  Его можно не использовать.*/
  /* display: inline-block; */
  width: 100%;
  height: 200px;
}

.first b {
  /* Поумолчанию элемент <b> является строчным элементом*/
  /* К элементу b применяется свойство display: block;
  которое в свою очередь становится блочным и его ширина 
  занимает всю ширину родительского блока, таким образом
  весь оставшийся контент переносится на следующую строку.*/
  /* display: block; */
} 

.first i {
  /* Элемент <i> является строчным элементом.
  Его функция заключается в том что бы выделить вложенный 
  в него текст курсивом, применение к данному элементу
  свойств высоты и ширины не уместно))))*/
  /* display: inline;
  height: auto;
  width: 100px;  */
}
/* конец первого задания */