Пожалуйста,нужна помощь.(27/32 на 100%)

Написал все через флоаты,паддинги и маргины. Код таким образом получился очень большим и вообще мне кажется, что так люди не пишут сетки. Можете помочь советом, чем это можно заменить? Я не прошу переписывать код заново, просто немножко объяснить.
!!!CSS!!!

html,
body {
margin: 0;
padding: 0;
}

body {
width: 450px;
height: 335px;

font-size: 10px;
font-family: “Arial”, sans-serif;
color: white;
}
.header{
background-color:#34495e;
min-height:170px;
width:450px;
padding:10;
}

.header-inner{
background-color:#c0392b;
float:left;
height:30px;
width:345px;
margin:10px;
margin-left:50px;
padding-left:5px;
padding-top:5px;}
.menu{
background-color:#3498db;
clear:both;
height:30px;
padding-left:55px;
padding-top:5px;

}
.promo1{
background-color:#c0392b;
float:left;
width:165px;
margin-right:10px;
margin-left:50px;
}

.promo2{
background-color:#c0392b;
width:165px;
float:left;}

.qwe{
padding-left:5px;
padding-top:5px;

margin-top:10px;
height:55px
}
.container .column{
background-color:#3498db;
height:105px;
float:left;
width:65px;
margin-right:10px;
margin-top:10px;
margin-bottom: 10px;

}
.column:nth-child(2){
width:185px;
padding-top:5px;
padding-left:5px;
}
.column:nth-child(3){
margin-right:0px;
padding-top:5px;
padding-left:5px;
}
.column:first-child{
margin-left:50px;
padding-top:5px;
padding-left:5px;
}

.footer{
background-color:#34495e;
height:35px;
padding-left:55px;
padding-top:5px;
clear:both;}

Увы… пишут…


HTML вообще-то тоже нужен для полной ясности,
но и из CSS уже понятно, что “сетка” сделана не совсем правильно.

Смысл этого испытания – применить ранее полученные знания: сделать сетку растягивающейся по вертикали и расположенной по середине по горизонтали…

По возможности повторите курс, разберитесь с центровщиком,
Вам должно быть понятно всё в предыдущем упражнении – 26/32.

На форуме по 27/32 написано много… ищите.

Или спрашивайте – отвечу…

Спасибо за ответ , пройду еще раз курс пожалуй :*

Пройдите…

Должно получиться примерно так: Испытание Сетки [27/32] 100% Ревью кода

Можете подсказать? Не могу понять как работает min-height , min-width и то же самое с max. Почему я не могу просто прописывать width и height ?

height задаёт минимальный размер контейнеру, независимо от содержимого.
Если контент не будет помещаться в контейнере – контент начнёт выпадать.

min-height задаёт просто минимальный размер контейнеру.
Когда контента становится много блок растягивается по высоте.

1 лайк

Аааа,интересно…

Спасибо

А не выгодней ли тогда постоянно использовать min-height, чтобы избежать случая выпадения текста?

В хедере и меню задан height:
Помогите разобраться. Испытание: строим сетку [27/32]

Здесь везде min-height:
Помогите разобраться. Испытание: строим сетку [27/32]

По обстоятельствам нужно смотреть.
Где-то нужно жестко прописать, где-то не очень.

В этом испытании – точно height нигде не нужен…

Как-то сложно…

А говорят CSS и HTML за час можно выучить))
Спасибо

Врут, причём безбожно!

Хочу после HTML и CSS PHP начать учить, не знаете сайты где можно примерно так же как тут его учить
?

Не знаю. Но, после HTML и CSS нужен будет JS.