-
投稿者投稿
-
2025年6月16日 3:13 PM #6455
【お使いの unitone のバージョン】20.0.0
【お使いのブラウザ】Chrome### 発生している問題
いつもお世話になっております。
1カ月前にナビゲーション内のボタンの最小幅が効かない不具合をご相談させていただいた者です。
unitone20.0.0にアップデートしたところ、再びナビゲーション内のボタンの最小幅が効かなくなりました。
ご確認いただけますと幸いですm(_ _)m
♥ 0いいねをした人: いません2025年6月16日 3:22 PM #6456わーすみません!すぐアップデートします。
♥ 0いいねをした人: いません2025年6月16日 3:30 PM #6457変更をいれて、20.0.1 としてリリースしました。アップデートするとどうでしょうか?
♥ 0いいねをした人: いません2025年6月16日 4:02 PM #6458ご対応ありがとうございます!
ナビゲーションブロック単体で使った時は最小幅が反映されました。
ただ、ヘッダーで使った時は最小幅が反映されません…。
両端ブロックと干渉してるっぽいです!
♥ 0いいねをした人: いません2025年6月16日 4:28 PM #6459両端ブロックについては前回のトピックで書いた通り、相性問題的なものになっちゃいます。unitone 側で調整するのが難しいので、個別に CSS で対応して頂く必要があります。
♥ 0いいねをした人: いません2025年6月16日 7:01 PM #6460失礼しました…。
両端ブロックでも最小幅を上書きできるようになったと勘違いしておりました…。
今回はナビゲーションブロックをdivブロックでラップして、divブロックの追加CSS機能でボタンブロックにwidthを与えて対応しました!
あと、レスポンシブスイッチャーのおかげで、今回の場合でもメディアクエリのCSSを書かなくて良いことに感激しております😊
♥ 0いいねをした人: いません2025年6月17日 11:07 AM #6476あ、エディターだけでもできるかもです!
ボタンブロックって ボタン(Buttons) > ボタン(Button)という親子関係になっていて、両端ブロック内でボタン(Button)の「最小幅」を指定するだけだと効きません。これは両端ブロックの直下のブロックは、幅が
fit-content
になるためです。この例だとボタン(Buttons)の幅が
fit-content
になっているのがエディター上で確認できると思います。ここを、fit-content
から、ボタン(Button)に入力した最小幅と同じ値に書き換えてみてください。多分それで意図した表示になるのではないかなと…。♥ 0いいねをした人: いません2025年6月17日 1:33 PM #6477ありがとうございます!
ボタン単体であれば、その方法で実装ができることが確認できました!
ただ、ナビゲーションブロックの場合は、固定ページなどの他のブロックが入っていて、2段に表示されてしまいますね〜
色々と触ってみましたが、ナビゲーションブロックではCSS書く必要がありそうです🤔
♥ 0いいねをした人: いません2025年6月17日 4:04 PM #6478あーーほんとですね、失礼しました。これ
min-width
じゃなくてwidth
で指定するようにしたら、見た目的にはほぼ同じになるかなと思うんですよね。なので、– 両端ブロックの直下の場合は
min-width
じゃなくてwidth
の CSS が当たるように変えるor
– 設定パネルで
min-width
とwidth
を切り替えられるようにする(ちょっと UI が思い浮かびませんが…)という感じにすれば使いやすくなるのかなぁと思ったりしました。ちょっとどうするのがベターかすぐには決めきれないので、今後の検討課題にしたいと思います!
♥ 0いいねをした人: いません2025年6月17日 4:30 PM #6479 -
投稿者投稿
- トピック「【バージョン: 20.0.0】ナビゲーション内のボタンの最小幅が機能しない」には新しい返信をつけることはできません。