hatena design memo
header
<div class="main">
footer
</div> <div class="sidebar"> <hatena name="profile" template="hatena-module"> <hatena name="searchform" template="hatena-module"> <hatena name="section" template="hatena-module" listlimit="10" titlelength="" moduletitle="" showcategory="false"> <hatena name="rss" template="hatena-module" moduletitle="Recent Tracks" url="http://takatoshi.dyndns.org/misc/recenttracks.cgi?of=100"> <hatena name="graph" moduletitle="" template="hatena-module" graphname="counter" background=""> <hatena name="counter" cid="1"> </div> <div class="footer"> </div>
body { margin: 0; } h1, h2, h3 { margin: 0; padding: 0; } a:link { color: rgb(34,98,245); text-decoration: none; } a:visited { color: rgb(34,98,245); text-decoration: none; } a:hover { color: rgb(34,98,245); text-decoration: underline; } a:active { color: rgb(34,98,245); text-decoration: underline; } a.keyword:link { color: inherit; text-decoration: none; } a.keyword:visited { color: inherit; text-decoration: none; } a.keyword:hover { color: inherit; text-decoration: underline; } a.keyword:active { color: inherit; text-decoration: underline; } /* ---------- */ h1 { /* position: fixed; top: 0px; left: 0px; width: 100%; */ background-color: rgb(81,118,236); font: normal 140% "Lucida Grande" sans-serif; padding: 10px; z-index: 1; } h1 a:link { color: #fff; text-decoration: none; } h1 a:visited { color: #fff; text-decoration: none; } h1 a:hover { color: #fff; text-decoration: underline; } h1 a:active { color: #fff; text-decoration: underline; } div.main { /* position: relative; top: 50px; left: 0px; */ width: 75%; } div.calendar { font: normal 10px georgia, serif; margin: 5px; text-align: right; } div.day { font: normal 12px helvetica sans-serif; color: #333; line-height: 130%; margin-top: 2px; } h2 { font: normal 90% geogia serif; margin-top: 5px; margin-bottom: 5px; padding-left: 11px; padding-right: 11px; } div.body { padding-left: 11px; padding-right: 11px; } div.section { margin-bottom: 10px; border-bottom: 1px solid #eee; padding-left: 11px; padding-right 11px; } h3 { width: 100%; display: block; font: bold 15px helverica sans-serif; color: #000; letter-spacing: 0.07em; } h3 a:link { color: #000; text-decoration: none; } h3 a:visited { color: #000; text-decoration: none; } h3 a:hover { color: #000; text-decoration: underline; } h3 a:active { color: #000; text-decoration: underline; } div.comment { margin: 11px; border: 1px dashed #999; padding: 10px; } div.refererlist { margin: 11px; border: 1px dashed #999; padding: 10px; } /* -------------------- */ div.sidebar { /* position: fixed; */ position: absolute; top: 46px; right: 0px; width: 21%; padding-left: 10px; padding-top: 5px; padding-bottom: 10px; color: rgb(91,91,91); font: 12px helvetica, sans-serif; padding-right: 10px; padding-top: 2px; letter-spacing: 0.08em; border-left: 1px #C3C3C3 solid; background-color: #F2F2F2; } div.hatena-module { padding-left: 3px; } div.hatena-module a:link { color: #555; text-decoration: none; } div.hatena-module a:visited { color: #555; text-decoration: none; } div.hatena-module a:hover { color: #555; text-decoration: underline; } div.hatena-module a:active { color: #555; text-decoration: underline; } div.hatena-moduletitle { padding-top: 2px; font: bold 12px "Lucida Grande" sans-serif; color: #000; } div.hatena-moduletitle a:link { color: #000; text-decoration: none; } div.hatena-moduletitle a:visited { color: #000; text-decoration: none; } div.hatena-moduletitle a:hover { color: #000; text-decoration: underline; } div.hatena-moduletitle a:active { color: #000; text-decoration: underline; } div.hatena-module ul { list-style-type: square; padding-left: 20px; } div.hatena-module li { margin-top: 2px; } /* -------------------- */ .highlight { background-color: yellow; } .photo { padding: 10px; } pre { margin: 0 1em; border: 1px solid black; padding: 10px 10px; background-color: #444; color: white; font-family: "Courier New", Courier, sans-serif; font-size: 12px; overflow: auto; position:relative; /* make IE work correctly */ } blockquote { border: 1px solid #000; padding: 0 1em; font-size: 90%; background-color: #ffff7b; } img { border: none; } dt { margin-top: 10px; margin-bottom: 5px; font: normal 110% verdana sans-serif; }