<div class="cross"></div>
.cross {
width: 100px;
height: 100px;
position: relative;
margin: 0;
padding: 0;
border: 1px solid #ccc;
}
.cross:after{
content: "";
display: block;
position: absolute;
top: 0px;
left: 45px;
width: 10px;
height: 100%;
background-color: red;
}
.cross:before {
content: "";
display: block;
position: absolute;
width: 100%;
height: 10px;
background-color: red;
top: 45px;
left: 0;
}