Raindrops　取扱説明書

Raindropsテーマのテーブル要素記述の要点

デフォルトはtable-layout:fixed;です

table　要素に　class autoを記述していただくとセル幅の指定ができます

デフォルトの文字列の位置はtext-allign:rightです

table　要素に　class leftまたは、centerを記述していただくとセルは、それぞれのtd要素のtext-allignは、変更されます。
個別のセルの、文字位置は、それぞれのtdにleft,centerまたはright　CSSクラスを指定してください

Example table element
	text align left use CLASS left
text align right use CLASS right	text align left use CLASS left
text align center use CLASS center	text align center use CLASS center
text align center use CLASS center	text align right use CLASS right

<table class="eventschedule auto left">
 <col class="left-column">
 <col class="right-column">
 <tbody>
 <tr>
<th colspan="2">Example table element</th>
 </tr>
<tr>
<td class="center"><img src="https://www.tenman.info/images/pen.jpg" width="100" alt="test image" /></td>
<td class="left">text align left use CLASS left</td>
 </tr>
 <tr>
<td class="right">text align right use CLASS right</td>
<td class="left">text align left use CLASS left</td>
 </tr>
 <tr>
<td class="center">text align center use CLASS center</td>
<td class="center">text align center use CLASS center</td>
 </tr>
 <tr>
<td class="left">text align center use CLASS center</td>
<td class="right">text align right use CLASS right</td>
 </tr>
 </tbody>
</table>

Custom field

field name:css

Values:

 
/* columns width.( need table css class auto )*/
.left-column{
width:100px;
}
.right-column{
width:auto;
background:#eee;
}
/* cell color and background */
td:first-child{
background:#ccc;
color:#000;
border:1px dotted #999;
}
td:last-child{
background:#eee;
color:#000;
border:1px solid #aaa;
}
th{
background:#aaa;
color:#fff;
font-size:138.5%;
}
/* width of table */
table{
width:100%;
margin:3em auto;
}

将来この記述が不要になる改修を行う予定でいます（1.202現在）

追記:ver1.203からこの記述が不要になる予定です。2014/3/14

table.left,
table.right,
td.left,
td.right{
float:none;
}