css inlinestyle,CSS - style horizontal line

EDIT: Sorry, I missed your IE8 requirement...this probably won't work there. I apologize. I don't have access to it to check.

You can use the :before and create a box, rotate it, apply some border, absolutely position it and voila, there you have it:

HTML:

CSS:

.container {

float: left;

width: 100%;

height: 50px;

background-color: #1978a4;

line-height: 50px;

}

hr.line {

border-color: #fff;

position: relative;

}

hr.line:before {

content: '';

height: 10px;

width: 10px;

-webkit-transform: rotate(45deg);

-moz-transform: rotate(45deg);

-o-transform: rotate(45deg);

-ms-transform: rotate(45deg);

transform: rotate(45deg);

position: absolute;

left: 50px;

border-bottom: 1px solid #fff;

border-right: 1px solid #fff;

background-color: #1978a4;

top: -5px;

}