はてなダイアリーのデザイン変更についての質問です。

スタイルシートを変更します。


まず、本文の枠を 70px ほど広げます。
(★) を入れた三ヶ所です。

div.hatena-body{
        position:relative;
    width: 800px;       /* ← 730px (★) */
    margin: 0 auto;
    padding:0 0 20 0;
    border:0;
    text-align:left;}

div#main {
    float: left;
    clear: left;
    width: 570px;       /* ← 500px (★) */
        text-align:center;}

    ...

div.day{
    background:url('http://tk115.s176.xrea.com/planet/day_ft.gif') left bottom no-repeat;
    width: 570px;       /* ← 500px (★) */
    margin:0px auto 20px auto;
    padding:0 0 45 0;
    _height:1%;}

これだけだと、丸い角を表現している画像（日記の上と下）がずれてしまいます。
本当は、サイズに合わせた画像を用意した方が良いのでしょうけれど、無理やりサイズを合わせてみます。
(★) をつけた二ヶ所の変更と、三ヶ所の追加です。

h2{
    position:relative;
    margin:0 0 0 0;
    padding:5 40 0 10;
    border:0px;
    background:url('http://tk115.s176.xrea.com/planet/day_hd.gif') no-repeat top right;
    background-size: 570px 46px;    /* 追加します (★) */
    text-align:right;}

    ...

div.body{
    color:#333333;
    border:0px;
    clear: both;
    padding: 0 0 0 60;      /* ← 0 0 0 46 (★) */
    margin:0px 0px;
    _height:1%;
    background-size: 570px;         /* 追加します (★) */
    background:#fff url('http://tk115.s176.xrea.com/planet/day_bd.gif') repeat-y;}

div.day{
    background:url('http://tk115.s176.xrea.com/planet/day_ft.gif') left bottom no-repeat;
    width:570px;
    margin:0px auto 20px auto;
    padding:0 0 45 0;
    background-size: 570px 100px;   /* 追加します (★) */
    _height:1%;}

    ...

div.comment{
    font-size:80%;
    background:url('http://tk115.s176.xrea.com/planet/day_bd.gif') repeat-y;
    margin:0;
    padding: 0 0 0 60;      /* ← 10 0 10 46 (★) */
    color:#50b4e5;
    border:0px;
    text-align:left;}

後半で追加した三行にある「570px」は、div.day の width の値と同じにします。
変更した二ヶ所の 46 → 60 は、画像が合うように調整です。