Home arrow Joomla!でサイト管理 arrow FAQ arrow [Joomla!　FAQ]table組みしたhtmlをコピペすると余白だらけに
[Joomla!　FAQ]table組みしたhtmlをコピペすると余白だらけに プリント
テーブルでデザインをしていた従来のｈｔｍｌをそのままコピー＆ペーストした場合、余白がやたらと多くなり、画像がバラバラになることがあります。
これは、サンプルのスタイルでは汎用的に余白を入れるようになっているからです。
　→新規でテーブルを作るときは、適度に余白があるので標準のままが便利だったりしますが...。


こんなときは、元のスタイルをコピーして、余白のないスタイルを作っておくと便利です。

修正するファイルは　/templates/[オリジナルTemplate]/css/template_css.css です。

 /* 汎用コンテンツテーブルのスタイル　*/
table.contentpaneopen {
  width: 95%;
    padding: 0px;
    border-collapse: collapse;
    border-spacing: 0px;
    margin: 0px;
}
table.contentpaneopen td {
    padding: 0.5em 1em;
    font-size: 12px;
    line-height: 1.3;
}
table.contentpaneopen td.componentheading {
    padding-left: 4px;
}

 
これを下記のように変更します。
→フォントサイズなどは適当に設定します。

 

 /* コンテンツテーブルのリセット　*/
table.contentpaneopen_reset {}　←新しく_resetのスタイルを作って、値をクリアします。

table.contentpaneopen_reset td {
    padding: 0px;
    font-size: 11px;
    line-height: 1.5;
}

table.contentpaneopen_reset td.componentheading {}

 

contentpaneopenクラスは、通常のコンテンツ作成（ページ作成）本文で利用されるスタイルのクラスなので、このcontentpaneopenの文字列に新しい文字を追加して、新しいクラスを作ります。

ページクラスの変更



後は、コンテンツページのページクラスに、追加した文字列（今回の場合は、_reset）を設定すれば、contentpaneopen_resetのクラスを使用されるようになります。

テーブルに限らず、既存のｈｔｍｌからページ移植をするときは、それようのクラスを作っておくといいでしょう。  

 
 
[ 戻る ]