■ユーザーズフォーラム リニューアルのお知らせ
新規投稿は新ユーザーズフォーラムにお願いします。

テーマをclothowebさんのライトブルーにしています。css で複数の table の書式を定義する方法が分かりません。

ftbfg > テーマをclothowebさんのライトブルーにしています。css で複数の table の書式を定義する方法が分かりません。 @ 2012/9/27 13:30
固定ページ products を下記のように記述しています。
<h2 class="contents-head" style="padding-bottom: 20px;">
<?php $bcBaser->img('tb_products.png',array('alt'=>'製品情報','width'=>'712px','height'=>'40px')) ?></h2>
<div class="section">
<table cellpadding="0" cellspacing="0" class="row-table-01">
<tbody>
<tr><th width="150">項目1</th><th width="80">項目2</th><th width="200">項目3</th><th width="280">項目4</th></tr>
<tr><td>内容11</td><td>内容12</td><td>内容13</td><td>内容14</td></tr>
<tr><td>内容21</td><td>内容22</td><td>内容23</td><td>内容24</td></tr>
<tr><td>内容31</td><td>内容32</td><td>内容33</td><td>内容34</td></tr>
<tr><td>内容41</td><td>内容42</td><td>内容43</td><td>内容44</td></tr>
</tbody>
</table>
</div>
しかし各項目の幅は変わりません。class名も変えてみましたが項目の幅は変わりません。
style.css と products をどのように変更すれば、各項目の幅を設定できるのでしょうか?
初心者です。よろしくお願いします。
テストURLは 
http://ftbfg.net/basercms/index.php/
です。
clothoweb > Re: テーマをclothowebさんのライトブルーにしています。css で複数の table の書式を定義する方法が分かりません。 @ 2012/9/27 17:51
ftbfgさん、こんにちは!

私の場合、横幅の調整だけを設定するときは以下のようにしています。
※ そのままCKEditorに貼り付けて試すことも出来ます。
<table class="list">
	<colgroup width="15%">
	</colgroup>
	<colgroup width="35%">
	</colgroup>
	<colgroup width="15%">
	</colgroup>
	<colgroup width="35%">
	</colgroup>
	<tbody>
		<tr>
			<th>
				項目 [1]</th>
			<th>
				項目 [2]</th>
			<th>
				項目 [3]</th>
			<th>
				項目 [4]</th>
		</tr>
		<tr>
			<td class="center">項目11</td>
			<td class="center">項目12</td>
			<td class="center">項目13</td>
			<td class="center">項目14</td>
		</tr>
		<tr>
			<td class="center">項目15</td>
			<td class="center">項目16</td>
			<td class="center">項目17</td>
			<td class="center">項目18</td>
		</tr>
		<tr>
			<td class="center">項目19</td>
			<td class="center">項目20</td>
			<td class="center">項目21</td>
			<td class="center">項目22</td>
		</tr>
		<tr>
			<td class="center">項目23</td>
			<td class="center">項目24</td>
			<td class="center">項目25</td>
			<td class="center">項目26</td>
		</tr>
	</tbody>
</table>


・サンプルページ
http://clothoweb.info/products

今回のftbfgさんの場合は、以下のようにソースを変更してみて
横幅がちゃんと変更されるかを試してみていただけますでしょうか?

もし、横に2つのセルがある場合は、下記のように2行並べます。
<colgroup width="指定パーセント"></colgroup>
<colgroup width="指定パーセント"></colgroup>

もし、5列ある場合は同じように<colgroup>〜</colgroup>を
5つにパーセンテージを割り振って記述するやり方です。

また、直接数値を入力して横幅や高さを変更したい場合はテーブル内の該当箇所で
右クリックをしていただき、「セル」→「セルプロパティ」で変更できると思います。

ただ、テーブルの横幅が標準では100%になっていたかと思います。
テーブル自体の横幅を変更したい場合は、テーブルの上で右クリックした後に
「テーブルプロパティ」を選択して横幅をピクセルなどで変更してみて下さい。

私自身は、CKEditorがあってもソース表示での編集が殆どなので
画像アップロード以外では全然活用出来ていないかも知れません。^^;

テーブル周りの該当CSSの箇所は後ほど報告させていただきます。
ftbfg > Re: テーマをclothowebさんのライトブルーにしています。css で複数の table の書式を定義する方法が分かりません。 @ 2012/9/29 8:52
教えていただいた方法でやろうとしていた結果が得られました。
有難うございました。
ログイン
ユーザー名:
パスワード:


  新規登録 / パスワード紛失

検索

facebook
フォーラムで悩みが解決した場合など、よかったら「いいね!」をポチっとクリックしてください!質問の回答者や開発者の励みになります

フォーラムガイド


関連リンク

オンライン状況
26 人のユーザが現在オンラインです。 (26 人のユーザが フォーラム を参照しています。)

登録ユーザ: 0
ゲスト: 26