@charset “utf-8”;
/* CSS Document /
.ui.stackable.grid > .row {
padding: 0;
}
/.content{
margin-top:1em;
margin-bottom:1em !important;
}*/
.ui.container{
height:auto !important;
min-height:100% !important;
width:85%;
margin:1.5em auto;
}
body{
height:auto;
}
質問者の貼り付けたCSSをコードブロックにします。
@charset "utf-8";
/* CSS Document /
.ui.stackable.grid > .row {
padding: 0;
}
/.content{
margin-top:1em;
margin-bottom:1em !important;
}*/
.ui.container {
height: auto !important;
min-height: 100% !important;
width: 85%;
margin: 1.5em auto;
}
body {
height: auto;
}
質問者が貼り付けたCSSにコメントアウトされている部分があり、どのようにしたいのか正確にはわからないのですが
適当に 1800px にしています。
formBridge.events.on("form.show", () => {
const main = document.querySelector(".fb-custom--main");
if (main) {
main.style.setProperty("max-width", "1800px", "important");
}
});
元のレイアウトと新しいバージョンのレイアウトが対応していないため適当に対応させています。
新バージョンでは、公開フォーム内の要素に fb-custom-- で始まるクラスが付与されています。そのため、旧クラスを対象にしたCSSは効かなくなっています。
（「FormBridgeクラス」一覧をご参照ください ）
JavaScriptカスタマイズ | FormBridge
ご回答ありがとうございます。
ご回答いただいたCSSをベースにkintoneからの連携でフォームの新規作成をしてみましたが、何が悪いのか添付の画像のように回答フォームが960ピクセルになってしまいます。
添付いただいた画像では回答フォームの横幅が拡大できていると思うのですが、何かkintoneからの連携により不具合が生じているのでしょうか？
↓小さくて分かりずらいですが、現状のプレビューを添付します。
【以下続きです】
↓イメージとしては以下のように、赤矢印のタイトル、回答フォームの横幅を広げたい感じなのですが、ご回答いただいたCSSをベースに試行錯誤しますが上手くいかない状況です。
アドバイスよろしくお願いします。
ご回答ありがとうございます。
ご回答いただいたCSSをベースにkintoneからの連携でフォームの新規作成をしてみましたが、何が悪いのか添付の画像のように回答フォームが960ピクセルになってしまいます。
添付いただいた画像では回答フォームの横幅が拡大できていると思うのですが、何かkintoneからの連携により不具合が生じているのでしょうか？
↓小さくて分かりずらいですが、現状のプレビューを添付します。
私は、JavaScriptの回答しかしていません。
この回答のCSSは、質問者がコードブロックにしていなかったCSSを見やすくして貼り付けなおしているだけです。
しまうのは、Formbridgeのデフォルトの広さが960ピクセルだからだとすると何も設定が効いていないのではないでしょうか？
このトピックはベストアンサーに選ばれた返信から 3 日が経過したので自動的にクローズされました。新たに返信することはできません。
