В первом задании крыша домика, как?


#1

Кто нибудь объясните, как вышло изображение в форме треугольника(крыша домика)? Создал уже отдельно у себя файлы, воспроизвел в браузере, пытался менять значения, ничего подобного, теги селекторы стандартные, в чем подвох?


#2

Никакого подвоха нет: замените белый в свойстве border: 150px solid white; на какой-нибудь отличный от него в
.roof {
width: 0;
margin: 0 auto;
margin-top: -50px;
border: 150px solid white;
border-bottom-color: red;
}`

И сделайте width отличной от нуля, равно как можете задать самостоятельно height с любым значением, закомментировав строку margin-top: -50px;


#3

Что создало форму треугольника, объясните сам механизм? Со всеми элементами понятно, за исключением треугольника.


#4

Ответ найден! Сочетание
*border: 200px solid (цвет);
border-(сторона)-color:(цвет);

дает такой эффект, причем в любую сторону.:yum:


#5

При это ширина блока задаётся 0. А затем идут манипуляции с границами.