お世話になっております。
下記の記事を参考にチェックボックスを折り返すよう試みているものです。
https://developer.cybozu.io/hc/ja/community/posts/115017926403
複数行で表示させるところまではできているのですが、
なぜかフィールドの外枠がフィールド名とフィールド項目のわずかな隙間に押しつぶされた形で表示されています。
CSSは下記のようにしています。
.control-gaia.field-XXXXXXX {
width: 1000px !IMPORTANT;
}
.control-value-gaia.value-XXXXXXX span {
float: left;
}
何が間違っているのかご教授いただきたいです。よろしくお願いします。
よこい様
お世話になっております。
トヨクモの江田と申します。
恐らく、floatの解除忘れが原因かと思います。
http://sutara79.hatenablog.com/entry/2016/09/26/130238
親要素に疑似要素を追加して、「clear: both;」を指定するのが簡単だと思います。
.input-radio-cybozu:after{
content: '';
display: block;
clear: both;
}
江田様
コメントが遅くなりました。
記載頂いた５行をCSSに追加することでやりたいことが出来ました！
ありがとうございます。
JavaScript勉強中の者です。お世話になっております。
私もよこい様と同じことで、悩んでいます。
私も、江田様より記載いただいた５行をCSSに追加したのですが、うまくいきません。
もしよろしければ、たとえば以下のCSSならどういう記述をすればよいか、ご教授いただければ幸いです。
@charset “UTF-8”;
.control-multiple_check-field-gaia.field-XXXXXXX {
width: 1200px !IMPORTANT;
}
.control-value-gaia.value-XXXXXXX span {
float: left;
}
.control-multiple_check-field-gaia.field-YYYYYYY {
width: 1200px !IMPORTANT;
}
.control-value-gaia.value-YYYYYYY span {
float: left;
}
このトピックはベストアンサーに選ばれた返信から 3 日が経過したので自動的にクローズされました。新たに返信することはできません。