更新日: 2018-03-31 (土) 11:39:21 (24d)

:Webサイト作成 TIPS
:css

CSSでtableを作るとき、paddingを指定しても、うまく反映されない

paddingをたとえばtable のスタイルに設定すると、全部のセルにpaddingが反映されないか、と思ってしまいますが、実際はされません。
されると楽なんですけどねー。

なので、次のような方法で、そのtableのtdにもスタイルが反映されるようにすればよいかと思います。

---CSS---
/* tableには全体的に反映させたいスタイルを記述 */
.table1 {font-size: 13px;
         border:1px solid #999999;
         border-collapse:collapse;
         width:680px;
         margin:5px auto 5px auto;}
.table1 td {border:1px solid #999999;
         border-collapse:collapse;
         padding:5px;}
--html---
<table class="table1" ><tr><td>サンプル1</td></tr>
<tr><td>サンプル2</td></tr>
</table>

table1のスタイルの最後、margin:5px auto 5px auto;は、右と左をautoに指定しておけば、HTMLでalign=centerとかやらなくても中央に配置するためのものです。

このページが参照された数
Total: 23349, 今日: 10, 昨日: 0
選択肢 投票
このページの情報は役に立った 2  
このページの情報は役に立たなかった 7  
どちらでもない 0  
このページが参照された数
Total: 23349, 今日: 10, 昨日: 0

でじうぃきは神奈川県横浜市の位置情報システム・スマホアプリ開発の株式会社オンラインコンサルタントが運営しています。
投稿
トップ   このページを編集する 再編集不可にする 差分 バックアップ 添付 複製 名前変更 リロード   新しいページを作る 一覧 検索する 最新の更新   ヘルプ   最終更新のRSS
Last-modified: 2018-03-31 (土) 11:39:21 (24d)