Gostaria de saber como posso fazer para que minha div fique com essa divisão de cores:
Desde já agradeço.
Você precisará usar CSS linear-gradient
.
linear-gradient
é uma funcionalidade das CSS3 para criar degrades entre 2 ou mais cores em linha.
Sendo assim você vai precisar usar o seguinte código para gerar este background na sua div
.gradientbg{
background: #f6f5f4;
background: -moz-linear-gradient(-45deg, #f6f5f4 0%, #f6f5f4 50%, #ffffff 51%, #ffffff 100%);
background: -webkit-gradient(linear, left top, right bottom, color-stop(0%,#f6f5f4), color-stop(50%,#f6f5f4), color-stop(51%,#ffffff), color-stop(100%,#ffffff));
background: -webkit-linear-gradient(-45deg, #f6f5f4 0%,#f6f5f4 50%,#ffffff 51%,#ffffff 100%);
background: -o-linear-gradient(-45deg, #f6f5f4 0%,#f6f5f4 50%,#ffffff 51%,#ffffff 100%);
background: -ms-linear-gradient(-45deg, #f6f5f4 0%,#f6f5f4 50%,#ffffff 51%,#ffffff 100%);
background: linear-gradient(135deg, #f6f5f4 0%,#f6f5f4 50%,#ffffff 51%,#ffffff 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f6f5f4', endColorstr='#ffffff',GradientType=1 );
border: 1px solid #000;
height: 100px;
width: 100%;
}
<div class="gradientbg"></div>