記事ブロックの「表」が表示されない

2018年9月30日 at 13:39

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

以前から質問させて頂いており申しわけありませんが、よろしくお願いいたします。(http://concrete5-japan.org/community/forums/chat/post-17455/ )

マーケットプレイスから購入した「Baseline」というテーマを使っているのですが、記事ブロックの「表」が編集画面でもサイトに反映しても表示されない状態になっています。

(画像h 表示はされませんが挿入されている様子)
(画像h1 マウスポインタで選択すると挿入されている範囲が選択されます)

「Stucco」や「Elemental」では正常に表示されます。

http://concrete5-japan.org/community/forums/beginner/post-13589/ を参考にさせていただき、属性 の『追加ヘッダー要素』に

<style>
table, th, td {
border: solid 1px #ccc !important;
}
</style>

を追加したところ「表」のプロパティにもグレー色の罫線が入ります。
(画像h2)

そのまま進めて保存するとグレー色で「表」が表示されました。
(画像h3)

せっかく購入したテーマなので何とか使いたいと思っています。

テーマの作者にも確認はしているのですが時間もかかりそうなので...

何かヒントになる事でもあれば宜しくお願い致します。

※Xserverでconcrete5 8.4.3です

タグ:

Re: 記事ブロックの「表」が表示されない

2018年10月1日 at 18:05
tableなど、要素に直接スタイルを指定するのは表示崩れの原因になるのでやめた方が良いです。
見た所、bootstrapベースのテーマみたいなんで、tableタグにtableとtable-borderedクラス付けりゃ良いかと
http://getbootstrap.com/docs/4.0/content/tables/#bordered-table
 

Re: Re: 記事ブロックの「表」が表示されない

2018年10月1日 at 22:00
Tao様、ありがとうございます。
知識不足で申し訳ありません。
具体的にはどこに記述すればいいですか?
よろしくお願い致します。
 

Re: 記事ブロックの「表」が表示されない

2018年10月4日 at 19:08
上記リンク先を読んでみてください
 

Re: 記事ブロックの「表」が表示されない

2018年10月4日 at 23:32
Tao様、ありがとうございます。
リンク先を確認させて頂きましたが解りませんでした。
私のレベルが低い事と努力が足りないようですね。
申しわけありませんでした。
時間はかかるかもしれませんが確認します。
お手数をおかけしました。
 

Re: Re: 記事ブロックの「表」が表示されない

2018年10月5日 at 8:39
dsdsさん
少しだけお助けできるかもです!

Taoさんがサンプルを出されている通りなのですが、
実際のコードを(画像)で例示しますね。

例えば、
添付 exTable01.pngの様な表をレスポンシブに表示させたいとします。
(途中カットしていますので、全部を見たい場合は、https://a-itc.info/blog/website20181003 にて確認してください)

この様な場合、
実際のコードは、
exTable02.png と続き
exTable03.png になります。

参考までに。
 

Re: 記事ブロックの「表」が表示されない

2018年11月5日 at 22:16
お手数をおかけして申しわけありません。
Yamachann11様、ありがとうございました。
調べたりファイルを書き換えてアップロードして試行錯誤しましたが私には解りませんでした。
テーマの作者に連絡をし続けて何とか対応してくれるかもしれません。
いつになるかわからないのが不安ですが交渉してみます。
ありがとうございました。
 

Re: 記事ブロックの「表」が表示されない

2018年11月30日 at 14:10
表の罫線が表示されないと言う理解でよろしいでしょうか?

Taoさんの解析通りであれば最終的に"table"タグに"table table-bordered"でクラス指定を行なえば解決すると言うことになります。

上記のクラス指定の方法が分からないとう事だと思いますので、下記を参考に設定を行なってみてください。

1. 該当の表を選択し、「表のプロパティ」を表示させる。
2. 「表のプロパティ」ウィンドウの「高度な設定」タブを選択する
3. 「スタイルシートクラス」のインプットフィールドに「table table-bordered」を入力

上記の動作で"table"タグに"table table-bordered"でクラス指定を行なえます。