質問: インラインフレームのwidthに関して https://obot-ai.com/campaign/こちらのページの上から3段目にwebチャットをいれたのですがなぜかサイドによってしまいます。できたらその下の画像と同じwidthにしたいのですがなぜこのようなことが起きているのでしょうか教えていただけると幸いです。
回答: ecマスターズの田中です。> ほかのデザインも崩れてしまって怖いのでというのは、たとえば「div」や「iframe」のような、タグを対象に指定されたような形でしょうか。スタイルシートでは、下記ページに紹介されている、あらゆる条件の組み合わせで適用する対象を指定することができます。http://www.htmq.com/csskihon/005.shtml特に、クラス名による指定は、ご自身で名付けた要素が対象となる、非常にわかりやすい方法ですので、まずはクラス名による指定から馴染んでいただければ、今後、自由なページデザインができるようになってまいります。> 縦をもっと伸ばしたい場合はどのように指定すればよろしいでしょうか。先程のソースを確認したところ、height="80%"にご変更いただいておりますね。heightの%指定は、その要素を囲む要素に高さが指定されていないと、%による計算ができず、何も指定されていない場合と同じ高さとなってしまいます。height属性で指定される場合は、height="400"のように、半角数字でご指定ください。この場合、pc・スマホ共通の高さとなります。スタイルシートで指定する場合、たとえば.web_chat iframe { height: 400px; }という指定ができます。(この場合、web_chatクラスを持つ要素の中にあるiframeタグの高さを400pxにする、という意味になります)「メディアクエリ」を用いて、画面横幅ごとに高さを切り替えることも可能です。