罰を待つソースコード

自動改行“しない”に設定しています。
記事を投稿すると自動で日付部分の色が交互に変わるようになっています。
文章が長くなると日付部分の下に回り込んで記載されます。
HEAD

@import url('https://fonts.googleapis.com/css?family=Arsenal');

@font-face
{
font-family:"こころ明朝" ;
src: url('https://cdn.leafscape.be/kokoro/Kokoro_web.woff')
     format("woff");
}

body{
font-family:"Arsenal","メイリオ", sans-serif;
font-size:12px;
letter-spacing:1px;
line-height:150%;
color:#000;
background:#fff;
margin:20px 0;
padding:0;}

@media screen and (min-width: 601px){
.wrp{
width:600px;
margin:0 auto;}
}

@media screen and (max-width: 600px){
.wrp{
width:100%;
margin:0 auto;}
}

.text{
margin:0 20px 0;
padding:2px 8px 8px;}

.text a{
color:#000;
background:#eee;
text-decoration:none;
border:none;
}

.title{
font-family:"こころ明朝" ;
font-size:13px;
background:#efefef;
padding:1px 3px;
margin:3px;
display:inline-block;}

.date{
background:#000;
color:#fff;
font-size:24px;
border:solid 1px #000;
padding:8px 0;
width:70px;
line-height:100%;
text-align:center;
float:left;
margin:0 15px 5px 20px;}

.date:nth-child(2n){
background:#fff;
color:#000;}

header{
text-align:center;
padding:20px;
margin:20px;}

.ft{
padding:0;
margin:20px;
text-align:center;
}

hr{
clear:left;
border-top:solid 2px #bbb;
border-right:none;
border-bottom:none;
border-left:none;
margin:10px;}

h1{
font-family:"こころ明朝";
font-weight:normal;
margin:20px;}

a{
color:#000;
background:#ccc;
text-decoration:none;
padding:0 3px;
margin:3px;
border:solid 1px #ccc;
transition:0.5s;
}

a:hover{
background:#fff;
}

</style>

ノート部分