お世話になっております。
テーブルにしたい項目を横に複数個並べると、PC画面よりはみ出してしまいます。
なので、各項目の幅を個別でデフォルトより狭く設定したいのですが、
方法はありますでしょうか?
現在、レコード参照画面での幅調整は以下のスクリプトにて対応していますが、
レコード編集・追加時においては同じロジックでは変化がありませんでした。
レコード編集・追加時での幅調整方法がありましたら、教えていただけると助かります。
よろしくお願いいたします。
お世話になっております。
テーブルにしたい項目を横に複数個並べると、PC画面よりはみ出してしまいます。
なので、各項目の幅を個別でデフォルトより狭く設定したいのですが、
方法はありますでしょうか?
現在、レコード参照画面での幅調整は以下のスクリプトにて対応していますが、
レコード編集・追加時においては同じロジックでは変化がありませんでした。
レコード編集・追加時での幅調整方法がありましたら、教えていただけると助かります。
よろしくお願いいたします。
arakakiさん
お世話になっております。サイボウズスタートアップスの武井です。
原因はgetFieldElement関数が詳細画面にしか対応していないためです。
DOM操作(※)になるため、あまりお勧めはできませんが、自力でテーブルの要素を取得・指定すれば同様に幅調整することが可能です。
※DOM操作はkintoneアップデートのクラス名変更等により動作しなくなる可能性があります。
サイボウズスタートアップス 武井様
お世話になっております。コメントありがとうございます。
DOM操作での設定について、確認してみます。
他にも方法がありましたらよろしくお願いします。
arakakiさん
css で、表示幅を変更できます。下記のような指定で項目ごとに指定できます。
subtable-nnnnnn の部分は、DOM上でサブテーブルの class につけられた番号を指定してください。
tr, td とその子要素に表示幅関係の指定がされていますので、それぞれの変更が必要です。
サイズは、表示を見ながら調整してください。
kintoneアップデートのクラス名変更等により動作しなくなる可能性があるのは、同様です。
.subtable-gaia.subtable-nnnnnn.edit-subtable-gaia th:nth-child(1) {
width: 140px !IMPORTANT;
}
.subtable-gaia.subtable-nnnnnn.edit-subtable-gaia th:nth-child(1) * {
min-width: 120px !IMPORTANT;
}
.subtable-gaia.subtable-nnnnnn.edit-subtable-gaia td:nth-child(1) {
max-width: 140px !IMPORTANT;
}
.subtable-gaia.subtable-nnnnnn.edit-subtable-gaia td:nth-child(1) * {
width: 120px !IMPORTANT;
}
.subtable-gaia.subtable-nnnnnn.edit-subtable-gaia th:nth-child(2) {
width: 120px !IMPORTANT;
}
.subtable-gaia.subtable-nnnnnn.edit-subtable-gaia th:nth-child(2) * {
min-width: 110px !IMPORTANT;
}
.subtable-gaia.subtable-nnnnnn.edit-subtable-gaia td:nth-child(2) {
max-width: 120px !IMPORTANT;
}
.subtable-gaia.subtable-nnnnnn.edit-subtable-gaia td:nth-child(2) * {
width: 110px !IMPORTANT;
}
rex0220さん
お世話になっております。
コメントありがとうございます。教えていただいたcssを実施し、うまくいきました。
ありがとうございます。大変助かりました。
※メモ書き
tdの下記設定はプルダウン項目のテーブル部分に使用すると、選択ボタンがずれます…
私はうまく扱えなかったので除外して設定しました。
.subtable-gaia.subtable-nnnnnn.edit-subtable-gaia td:nth-child(n) * {
width: XXXpx !IMPORTANT;
}
このトピックはベストアンサーに選ばれた返信から 3 日が経過したので自動的にクローズされました。新たに返信することはできません。