Здравствуйте, подскажите пожалуйста как правильно написать через css эфект текста на полке?
пример на скриншоте
я поступил так
согнул border но вот текст обратно выгнуть не получается
<!DOCTYPE HTML>
<html>
<head>
<title>Untitled</title>
<style type="text/css">
#news_head {
font-family: Verdana;
font-size: 13px;
color: #B85C00;
font-weight: bold;
padding-bottom: 3px;
border: thin dashed #111111;
display: inline-block;
-webkit-transform: skew(-20deg);
-moz-transform: skew(-20deg);
-o-transform: skew(-20deg);
}
#news_head > .span {
color: #777777;
/*выравниваю текст обратно*/
-webkit-transform: skew(20deg);
-moz-transform: skew(20deg);
-o-transform: skew(20deg);
}
#news_content {
color: #777777;
}
</style>
</head>
<body>
<div id="news_head">
<span >
заголовок
</span>
</div>
<div id="news_content">
текст<br><br>
</div>
</body>
</html>
Помогите пожалуйста
Простой
Средний