tableの枠線が消えない。border:noneが効かない。楽天アフィリエイトの枠線…

どうも。

久々にワードプレスカスタマイズ記事です。

このブログを作った初期にやっていたことですが、画像の周りを枠線で囲むようにしました。

ブログの写真・画像に枠をつけてチョット綺麗に見せる方法

これのせいかどうかちょっとわからないのですがいつの間にか「tableタグ」に枠線がつくようになっていました。

（追記）この画像の枠線については別問題かな。たぶん。

特に楽天の広告リンクを貼ると枠が気持ち悪くてしかたない。

ということで「tableの枠線を消す」カスタマイズ記事です。

tableの枠線を消す

By: Randy Aquilizan

うちのブログではtableタグなんて使わないのでCSSで一気にやっちゃおうと思う。

たぶん大丈夫だろう…と思って、いろいろ試してみました。

CSSにnoneを使ってブログ全体のtableのborderを消そうとしたり、個別のコードについてそれぞれタグをつけて消そうとしました。

西沢直木のIT講座

 

3 users

表に枠線を付ける方法（消し方も） | 西沢直木のIT講座

https://www.nishi2002.com/9256.html

投稿や固定ページにtableタグを使って表を入力するときは「border="0"」などの属性が使えない（利かない）場合があります。その原因と好きな枠線を追加する方法を紹介します。 tableタグの「border="0"」が無視される 表に自由な枠線を付ける前...

free.celux.jp

http://free.celux.jp/webdesign/affinger4/1711111affinger4

http://free.celux.jp/webdesign/affinger4/1711111affinger4

TezuBoa備忘録

 

2 users

HTML　テーブルの枠線を消す - TezuBoa備忘録

http://tezuboa.hatenablog.com/entry/2014/05/02/095351

<table><tr><td style="border-style: none;">AAA</td><td style="border-style: none;">BBB</td></tr></table> ↓ AAA BBB

4536

楽天アフィリエイトの枠を消したいです。 – 4536

https://4536.jp/forums/topic/topic-0-18

シェフさん、こんばんは！ 楽天アフィリエイトをやっているのですが、 画像貼り付けた時にテーブルの枠のようなものがですのですが、テーマによってはCSSを追加するだけで消せるようなのですが、楽天アフィの枠を消せる追加CSSとかを教えてもらえませんか？ あと、き...

www.sejuku.net

 

2 tweets

3 users

https://www.sejuku.net/blog/83489

https://www.sejuku.net/blog/83489

digilocus.net

 

1 user

楽天アフィリエイトのリンクの「外側の薄い枠線」を消す・センター寄せにする方法 ...

https://digilocus.net/20180616/rakuten-affiliate-frameborder/

これらの先人の知恵を借りたのですが、すべて不発に終わりました。

borderは消す気満々だったのですが、ちょっとお手上げです。

見栄えが悪いだけで、致命的ではないのでとりあえず置いておきますが…どうしたらいいのかしら？

一応tableに関係しそうなCSSの一部分を記載しておきます。


/*--------------------------------
エディタ用
---------------------------------*/
/*テーブル */
.post table {
border-top: 1px #999 solid;
border-right: 1px #999 solid;
}
table tr td {
padding: 10px;
border-bottom-width: 1px;
border-left-width: 1px;
border-bottom-style: solid;
border-left-style: solid;
border-bottom-color: #999;
border-left-color: #999;
font-size: 14px;
line-height: 25px;
}
.post table tr:nth-child(even) {
background-color:#f3f3f3;
}
#main .post table {
border-top-width: 1px;
border-right-width: 1px;
border-top-style: solid;
border-right-style: solid;
border-top-color: #999;
border-right-color: #999;
color: #333;
}

ここ以外にも要因はあると思うけど…わかりません。

いっそのことテーマを変えたらいいかな？

まとめ

ということで無理でした。

上に貼ったリンクたちはとても有用な情報が書いてあるので参考にしてみてください。