Помогите пожалуйста, как можно упростить мой код. Мне кажется он вышел громоздким.
html,
body {
margin: 0;
padding: 0;
}
body {
width: 450px;
height: 335px;
font-family: “Arial”, sans-serif;
font-size: 10px;
color: white;
}
.up {
background-color:#34495e;
height:160px;
padding-top:10px
}
.middle {
background-color:white;
}
.bottom {
background-color:#34495e;
}
.header {
background-color:#c0392b;
width:350px;
margin:auto;
min-height:35px;
}
.menu {
background-color:#3498DB;
min-height:35px;
margin-top:10px;
width:450px;
}
.promo1 {
background-color:#c0392b;
width:170px;
min-height:60px;
float:left;
margin:10px 10px 10px 50px;
}
.promo2 {
background-color:#c0392b;
width:170px;
min-height:60px;
float:left;
margin: 10px 50px 10px 0px;
}
.left {
background-color:#3498DB;
width:70px;
margin:10px 0px 10px 50px;
min-height:110px;
float:left;
}
.main {
background-color:#3498DB;
width:190px;
min-height:110px;
margin:10px;
float:left;
}
.right {
background-color:#3498DB;
width:70px;
min-height:110px;
margin:10px 50px 10px 0px;
float:left;
}
.footer {
background-color:#34495e;
min-height:35px;
float:right;
width:450px;
clear:both;
}
.layout-positioner {
width: 40px;
min-height: 10px;
margin:10 auto;
}
.header .layout-positioner {
padding-top:5px;
padding-left:5px;
}
.menu .layout-positioner {
padding-top:5px;
padding-left:55px;
}
.footer .layout-positioner {
margin-left:55px;
padding-top:5px;
}
.middle .layout-positioner {
padding-top:5px;
padding-left:5px;
}
.layout-positioner::after {
display: table;
content: “”;
clear: both;
}
.promo1 .layout-positioner,
.promo2 .layout-positioner{
padding-top:5px;
padding-left:5px;
}