tomemo

スキン「tree」を右サイドバー化するためのCSS -ピンク-

スキン「tree」を右サイドバー化するためのCSSのピンクバージョンです。

d0112463_16504874.jpg
demo



CSS


/* excite blog default skin html -右サイドバー化-*/

BODY{
margin:0;
padding:0;
background-image:url(http://md.exblog.jp/skn/img/a/01/15/6/bg_pink.jpg);}

BODY,TD,DIV,LI{
font:13px "MS Pゴシック",arial,helvetica,clean,sans-serif;
*font-size:small;
*font:x-small;
line-height:150%;
color:#333333; }

A:LINK{ color:#f93294; text-decoration:underline;}
A:VISITED{ color:#fd6256; text-decoration:underline;}
A:ACTIVE{ color:#f93294; text-decoration:underline;}
A:HOVER{ color:#f93294; text-decoration:none;}

#wrap {
width:900px;
margin:5px auto;
text-align:left;
background-image:url(http://md.exblog.jp/skn/img/a/01/15/6/tree_pink.gif);
background-position:80px 20px;
background-repeat:no-repeat;
overflow:hidden; }


/* title ********************/
#header {
width:550px;
margin:0 0 0 75px;
padding:0;
color:#4aa87a;
overflow:hidden;}

#header A:LINK { color:#4aa87a; text-decoration:none; }
#header A:VISITED { color:#4aa87a; text-decoration:none; }
#header A:HOVER { color:#4aa87a; text-decoration:none; }

.title { font-size:131%; line-height:120%; font-weight:bold; padding:20px 0 0 0;}
.url { font-size:93%; margin:10px 0; }

#header .usermenu { font-size:85%; margin:10px 0 20px 0;}
#header .usermenu A:LINK { color:#4aa87a; text-decoration:underline; }
#header .usermenu A:VISITED { color:#4aa87a; text-decoration:underline; }
#header .usermenu A:HOVER { color:#4aa87a; text-decoration:none; }

.profile { width:150px; margin:0; padding:0; line-height:130%;}

/* content ********************/
#content {
width:750px;
margin:0 0 0 75px;
padding:0 0 30px 0;
text-align:left;
overflow:hidden;}

/* sub */
#sub {
width:150px;
margin:30px 0 0 0;
float:right;
overflow:hidden;}

.mn {}
.MNTTL {
width:140px;
margin:30px 0 5px 0;
padding:2px 5px;
background-color:#ffacae;
font-weight:bold;
color:#ffffff;}

.memobody {
width:150px;
overflow:hidden;}

/* main */
#main {
width:500px;
margin:200px 0 0 0;
float:left; }

.post {width:500px; margin:0 0 70px 0;}

.post_head {
height:20px;
margin:0 0 10px 0;
padding:6px 0 10px 40px;
border-bottom:2px #76b797 solid;
background-image:url(http://md.exblog.jp/skn/img/a/01/15/6/point_pink.gif);
background-repeat:no-repeat;
font-weight:bold;
line-height:120%;
word-wrap: break-word; }

.post_admin { text-align:right; margin:0 0 10px 0; font-size:85%;}

.post_body {
width:500px;
margin:15px 0;
padding:0;
line-height:150%;
word-wrap: break-word;
overflow:hidden;}

.post_tail {
font:11px/150% TAHOMA;
margin:10px 0;
text-align:right; }

/*w500-(margin15+15)=w470*/
.COMMENT {
width:470px;
background-color:#ffffff;
padding:15px;
margin:20px 0px;
-webkit-border-radius:10px;
-moz-border-radius:10px;}

DIV.COMMENT_BODY{ width:470px; margin-bottom:20px; line-height:130%; word-wrap: break-word; }
DIV.COMMENT_TAIL{ margin:8px 0px 5px; font:8pt/150% TAHOMA; color:#777777;}
DIV.COMMENT_INPUT{ margin-top:20px; border-top:1px #aaaaaa dotted; padding-top:20px; }
DIV.COMMENT_LINE{ border-top:1px #aaaaaa dotted; margin:10px 0px 15px; }

.pager { width:500px; font-size:93%; text-align:center; margin:10px 0; padding:0;}

DIV.TRACK_TOP { LINE-HEIGHT : 170%; }
DIV.ARCHIVE_HEAD { FONT-WEIGHT : BOLD; MARGIN-BOTTOM : 10PX; }
DIV.ARCHIVE_BODY { MARGIN : 20PX 0PX; LINE-HEIGHT : 160%; PADDING-BOTTOM : 100PX; }

IMG.IMAGE_TOP{ MARGIN-BOTTOM : 15PX; }
IMG.IMAGE_LEFT{ MARGIN-RIGHT : 15PX; MARGIN-BOTTOM : 15PX; TEXT-ALIGN:LEFT;}
IMG.IMAGE_RIGHT{ MARGIN-LEFT : 15PX; MARGIN-BOTTOM : 15PX; TEXT-ALIGN:RIGHT;}
IMG.IMAGE_MID{ MARGIN-TOP : 15PX; MARGIN-BOTTOM : 15PX; }
IMG.BOOKMK{ MARGIN : 10PX; BORDER : 0PX; }
IMG.USERMENU{ MARGIN-LEFT : 8PX; }
IMG.LOGO{ MARGIN-BOTTOM : 10PX; }

DIV.BANNER{ MARGIN : 30PX 0PX 10PX; }

.SMALL{ FONT-SIZE : 11PX; }
.DATE{ FONT : BOLD 8PT/150% TAHOMA; }
.TIME{ FONT : 8PT/150% TAHOMA; TEXT-ALIGN : LEFT; }
.AUTHOR{ FONT : BOLD 8PT TAHOMA; }
.TXTFLD{ FONT-SIZE:9PT;COLOR:#000; BORDER:1PX SOLID #666678; BACKGROUND:#FFF; }
.SUBMIT{ FONT :9PT/140% ;COLOR:#000; }

DIV.CAL_TOP { }
DIV.CAL { MARGIN : 20PX 0PX 20PX; WIDTH : 150PX; TEXT-ALIGN : CENTER;}

DIV.CAL_HEAD { width:150px; font:8pt/150% VERDANA; text-align:center; padding:2px 0px; margin-bottom:10px; background-color:#ffacae; color:#ffffff;}

.CAL_HEAD A:LINK { color:#ffffff; text-decoration:underline; }
.CAL_HEAD A:VISITED { color:#ffffff; text-decoration:underline; }
.CAL_HEAD A:HOVER { color:#ffffff; text-decoration:none; }

DIV.CAL_BODY { WIDTH : 150PX; TEXT-ALIGN : CENTER;}
DIV.CAL_BOTTOM { }

.CAL{ FONT : 7PT/170% VERDANA; TEXT-ALIGN : CENTER; }
.CAL_DAY{ FONT : BOLD 7PT/170% VERDANA; TEXT-ALIGN : CENTER; }
.CAL_SUN{ FONT : BOLD 7PT/170% VERDANA; COLOR : #D36654; TEXT-ALIGN : CENTER;}
.CAL_SAT{ FONT : BOLD 7PT/170% VERDANA; COLOR : #3572A1; TEXT-ALIGN : CENTER;}
.CAL_TODAY{ FONT : BOLD 7PT/170% VERDANA; BACKGROUND : #E3E3E3; COLOR : #3D5586; TEXT-ALIGN : CENTER; }
.CAL_TR { }

DIV.XML { FONT : 8PT/150% VERDANA; TEXT-ALIGN : CENTER; }

#im{margin:1em auto; width: 100%; }

td.im_hit{ background: url(http://image.excite.co.jp/jp/portal/im/imach_icon_red.gif) no-repeat 0.5em 0.5em; padding: 0.5em 0.5em 0.5em 25px; cursor:pointer;cursor:hand; line-height: 100%; width: 100%;text-align:left;color:#333333;}


div.im_title{font-size:x-small;color:#000000;text-align:right;margin-bottom:.5em;}
td.im_hit:hover{background-color:#EAA294; color:#000000;}

table.im_summary{margin-top:3px;}
td.im_summary {font-size:small;font-family:"Arial";line-height:160%;}
span.im_url{font-size:small;font-family:"Arial"; text-decoration: underline;}
span.im_titletext{text-decoration: underline;}

[PR]
by asazuki508e | 2011-07-12 16:52 | Comments(0)