- 「フォーラムガイドライン」に必ず目を通してください。
- バージョンアップデート後に表示がおかしくなった場合は、
「SWELL設定」>「リセット」からキャッシュクリアを先にお試しください。 - フォーラム内検索で過去に同じようなトピックがないか検索してみてください。
フォーラム
すみません。お聞きしたいのですが、swellのタブブロック内にTablepressのテーブルをタブ毎に設置したのですが、読み込み時に、最初に指定されているタブ以外のタブ内のテーブルの見出し部分が左に縮んでしまいます。ソート機能を入れているのでクリックすると治るのですが、再読み込みするとまた縮んでしまいます。添付のような状態です。解決法はありますでしょうか。
因みに指定のurlはパスワードがかかっていてパスワードは3284です。
上記のように見出し(青い部分が端まで伸びていないといけないのに左隅に縮んでいます。)
TablePress
よくある問題のようです。
こちらを参考にjavascriptを追加できれば解決できそうです。
https://wordpress.org/support/topic/tables-within-elementor-components-tabs/
javascriptの追加ですか。リンク先を読んでみましたが、エレメンターを使っているケースで、解決に至っていないようです。。参考にして色々調べてみます。ありがとうございます。
サイトが見れないのでセレクタがあってるかわからないのですが、
私の環境では、tableタグ直前のwrapperに以下のCSSをあてると、
各幅の調整はされないですが、全体の幅は揃います。
.dataTables_scrollHeadInner {
width: 100%!important;
}
ありがとうございます。サブロさんの手法を試そうと昨日ページを開いたら、どういうわけか当問題が解決していました。
JavaScriptをいじったりCSSをいじったりしてたのですが、それらを初期に戻しておりて、唯一変更を残していたのが、 ここのフォーラムで質問する前に、AIに答えてもらった
- CSSの修正:タブ内容が隠れている間にページがロードされると、テーブルの幅や高さなどが正しく計算されない場合があります。以下のCSSを試してください。
.swl-tabPanel__body {
visibility: hidden;
}
.swl-tabPanel__body.is-show {
visibility: visible;
}
これにより、非表示のタブが見えなくなりますが、ブラウザはその存在を認識します。これにより、タブを切り替えたときにテーブルが正しく表示される可能性があります。
というものです。
ただ、昨日は自分のパソコンで開いたので、Adobeの古いアプリを使う関係で、OSもChromeもかなり古いバージョンのため、古いからswellが対応できているのかと思い、今日会社の最新バージョンで試したらやはり治っておりました。swellが問題解決してくれていて、自動更新されていたのか、上記のcssがキャッシュ等の時間差で効いたのか、謎のままです。
いろいろご迷惑をおかけしました。サブロさんのおっしゃるように他にも同じような問題を抱えているケースがあるみたいなので、明確な解決法が紹介されるといいかなと思います。