handsontable 複数テーブルを横並びにする方法

kintone カスタマイズ
1

いつもお世話になってます。

handsontable6.2.2を利用して、複数のテーブルを表示しようと考えています。

テーブルを横並びで表示したいのですが、技量が低く縦表示になってしまいます。

javaScript・HTMLの知識が乏しいため、横へ表示する方法をご教授いただければ幸いです。

 

カスタマイズビュー

<div id="sheet1"></div>
<div id="sheet2"></div>

js

(function() {
'use strict';
kintone.events.on(['app.record.index.show'], function(event) {
if (event.viewId !== [viewID]) return;
const container1 = document.getElementById('sheet1');
const hot1 = new Handsontable(container1, {
data: Handsontable.helper.createSpreadsheetData(5, 5),
rowHeaders: true,
colHeaders: true
});
const container2 = document.getElementById('sheet2');
const hot2 = new Handsontable(container2, {
data: Handsontable.helper.createSpreadsheetData(5, 5),
rowHeaders: true,
colHeaders: true
});
});
})();

 

よろしくお願い致します。

2

SiGeN様

お世話になっております．

CSSのフレックスボックスを用いると良いと思います．

カスタマイズビュー

<div id="wrapper">
<div id="sheet1">\</div\>
<div id="sheet2">\</div\>  
\</div\>

CSS

#wrapper{
display: -webkit-box; display: -ms-flexbox; display: flex;
}
3

江田篤史様

返事が遅くなり大変申し訳ございません。

教えていただいた内容で欲しい機能が実現できそうです！ありがとうございます！

4

このトピックはベストアンサーに選ばれた返信から 3 日が経過したので自動的にクローズされました。新たに返信することはできません。