読者です 読者をやめる 読者になる 読者になる

レイアウト直しました (再)

はてなダイアリーで float を使った段組レイアウトをしているテーマを使うと sideber がずれちゃうのでスタイル シートを追加して,ちゃんと表示されるように直しました.

レイアウト直しました. - @kei10in の日記

と書いたけど,レイアウトがくずれる原因はページのフッタに </div> がなかったせいみたいです'`,、('∀`)'`,、

今は,ちゃんと入れてあります(*'ω')b

ページのフッタを直したのでスタイル シートも同様になおしました.

↓が今設定しているスタイル シートです.(IEだと若干汚くなります)

/* sizing and positioning for layout */

body {
    margin: 0;
    padding: 0;
    text-align: center;
}

#simple-header img#logo-hatena {
    margin-left: 0;
}

#simple-header,
h1 {
    padding-left: 20px;
    padding-right: 20px;
    max-width: 860px;
    min-width: 728px;
    text-indent: 0;
}

.hatena-body {
    max-width: 900px;
    min-width: 768px;
    text-indent: 0;
    padding: 0;
    position: relative;
}

.main {
    margin: 0;
    margin-right: 221px;
    padding: 10px 20px;
    border-right: solid 1px #D2D6DE;
    max-width: 638px;
    min-width: 506px;
    width: auto;
    clear: both;
    float: none;
}

.main div#pager-top,
.main div#pager-bottom,
.main div#days {
    margin: 0;
    padding: 0;
}

.main div.calendar,
.main div.day {
    margin: 0;
    padding-left: 0;
    padding-right: 0;
}

.sidebar {
    margin: 0;
    border: 1px solid #D6D7DE;
    border-bottom: 0;
    clear: both;
    position: absolute;
    right: 0;
    top: 0;
    width: 220;
}



/* color */
body {
    background: #aaa;
}



/* articles */

div.refererlist {
    border: solid 1px #E7E9EE;
}



/* sidebar */

.hatena-module {
   padding-bottom: 10px;
   border-bottom: 1px solid #D6D7DE;
}

.hatena-module .hatena-moduletitle {
    margin: 0;
    padding: 8px 5px 8px;
    border-bottom: 1px solid #D6D7DE;
    background: #E5E6E8;
}

.hatena-module .hatena-modulebody {
    padding: 7px 0;
}

.hatena-modulebody a:hover,
.hatena-modulebody a:focus {
    background: #3A68C8;
    color: white;
}

.hatena-modulebody li a,
.hatena-modulebody li a:link,
.hatena-modulebody li a:visited {
    display: block;
    margin: 0;
    padding: 1px 1em 1px 1em;
    font-weight: bold;
}


/* hatena-module-profile */
.hatena-module-profile .hatena-profile p {
    padding: 0 7px;
}


/* hatena-module-calendar2 */
.hatena-module-calendar2 table.calendar {
    margin: 0 auto;
    padding: 7px;
    width: 206px;
}

.sidebar table.calendar td.calendar-prev-month,
.sidebar table.calendar td.calendar-next-month,
.sidebar table.calendar td.calendar-current-month {
    font-weight: bold;
    text-align: center;
}

.sidebar table.calendar td {
    padding: 0;
    border: 1px solid #D6D7DE;
    height: 2em;
}

.sidebar table.calendar td.calendar-sunday {
    color: #BE0C0C;
}

.sidebar table.calendar td.calendar-day {
    background: #F5F5F5;
}

.sidebar table.calendar a {
    display: block;
    line-height: 2em;
}

.sidebar table.calendar td.calendar-day a:link,
.sidebar table.calendar td.calendar-day a:visited {
    background: #EAEAEA;
}

.sidebar table.calendar td.calendar-day a:hover,
.sidebar table.calendar td.calendar-day a:focus {
    background: #3A68C8;
}


/* hatena-recentcomment */
ul.hatena-recentcomment li a,
ul.hatena-recentcomment li a:link,
ul.hatena-recentcomment li a:visited {
    display: inline;
    padding: 0;
}


/* hatena-module-sectioncategory */
.hatena-module-sectioncategory ul.hatena-sectioncategory li {
    padding: 0;
}

/* hatena-module-pv */
.hatena-module-pv .hatena-counter {
    padding-left: 7px;
}