title border cut effect

by John Doe

HTML

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css">

<div>
<div class="row">
  <h2><span><i class="fa fa-newspaper-o "></i>
News</span></h2>
  <div class="date">2015.04.20</div>
</div>

<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Assumenda velit nemo delectus similique, voluptatibus possimus aperiam ea aut numquam, maiores, beatae consequatur! Sapiente ea quasi quas veritatis vero id, quod!</p>
</div>

CSS

body{
  font-family: arial;
}
div{
  background-color: #ffffff;
}


.date{
  float: left;
  width: 50%;
  height: 34px;
  line-height: 32px;
  text-align: right;
  padding-right: 15px;
  box-sizing: padding-box;
}
p{
  font-family: arial;
  padding: 0 15px 15px 15px;
  clear: both;
}