-
ID:Mo7siI さんの質問

img {
max-width: 100%;
height: auto;
width /***/: auto;
}

これを書いてimgをレスポンシブ対応しているのですが、すると、imgに直接書くwidth, height属性が効きません。

WordPressのWYSIWYGでドラッグによるサイズ変更をした際に気づきました。
みなさんは、どのように対応してますか?

みんなの回答 5 件

ID:SZMsOc さんの回答

親要素に画像表示サイズを指定する。
レスポンシブの基本でっせ。

ID:Mo7siI

例えば、通常WordPressで画像を挿入するとなると
<p>
<img>
</p>

このような構成になるかと思いますが、画像を400pxにさせたい場合、
<p style="width: 400px;">
<img>
</p>
ってことですか?

えぇ〜〜じゃあ、WYSIWYGで完結させれないってこと?

ID:RpaAv5

styleのwidthもwordpress側で吐き出せばいいんじゃ?

ID:Mo7siI


プラグインかなんかですか?

ID:8sloe8

いや、普通に考えるとエディタにレスポンシブ用のスタイルを追加するってことだろ。
プラグインでwidth,heightを削るやつもあるかもしれんけど。

ID:8sloe8

1.JSかPHPでimgのwidth,height属性を削る。
2.エディタにレスポンシブ用のスタイルを追加。
3.importantで強引にauto指定
img { /*セレクタ指定でWYSIWYGの範囲まで狭めたほうがいい*/
height: auto !important;
width: auto !important;
}
上記のどれかでよくね?

ID:c36fdn さんの回答

そもそもimgタグにwidth, heightを付けないもんで。

ID:GIqYQg

ワードプレスは勝手に挿入されるわけよ

ID:p1g2tS

それデフォ設定だけど、使いにくいから消して使えばいいよ

ID:Mo7siI

だとすると、WYSIWYGのドラッグによるサイズ変更使えないやんっていう本末転倒なんす

ID:GTVTN7

本末転倒と言う程でもない
使うの我慢すればいいだけ

ID:P4VxDq さんの回答

おかしいな。。。WYSIWYGでサイズ変更するとタグに直書きになるよね?
その場合外部CSSで読み込むスタイル設定よりも優先度が高くなるからそっちが有効化されるはずなんだけどな。

ID:P4VxDq

ってか「%」指定と「px」指定の違いかな?

ID:P4VxDq

wpのWYSIWYGの考え方としてはWYSIWYGのドラッグでサイズ変更するのにその要素をレスポンシブに対応させるって考えがおかしいやん!って事なんだろうな。
レスポンシブの場合は「%」指定だけどWYSIWYGのサイズ変更は「px」指定になるからレスポンシブの概念とは外れてしまうからね。確かにこれは面白い話だね〜

ID:Mo7siI

そういうことになりますよねー。現状として、レスポンシブ対応のテーマではWYSIWYGのサイズ変更は使えない(おかしいやん!)ってことになってしまうということですよね

ID:YzJF5t さんの回答

本日のWYSIWYGスレ

ID:Mo7siI

あざす

ID:g7ooGc さんの回答

なんですか?
このレベルの低いスレは(笑)

WordPress ならフィルターフックとかアクションフックを知らないんすかね?
ま、知ってたらこんなスレは立たないかw

ID:g7ooGc

てか、editor-style を設定すればいいだけじゃん。
ここのサイトて、こんなにレベル低いの? 質問した所でドツボにハマるだけじゃんww
ドキュメントちゃんと読めばそもそも質問する内容でもないし…これだから、日本のウェブ業界はレベル低いんだろうな…。

ID:Mo7siI

editor-style置いてどうすんすかwビュー側全く影響出ないじゃん

だから、フック系でどうにかしなきゃいけないんだなーと

最終更新日:2014-09-30 (9,218 views)

関連するトピックス

ページ上部に戻る