素人質問失礼いたします。画像で■と□を揃える方法を教えてください。右側に揃えて欲しいです。

例えばこんな風に？



●CSS

div.right {

width: 320px; background-color: khaki; padding: 5px 10px; border-radius: 5px; margin-block: 30px;

\u0026amp; \u0026gt; ul.none {list-style-type: none; width: fit-content; margin: 0 0 0 auto;}

}

※数字や色、クラス名は適当なので適宜変更してください。



● HTML

\u0026lt;div class=\u0026quot;right\u0026quot;\u0026gt;

\u0026lt;ul class=\u0026quot;none\u0026quot;\u0026gt;

\u0026lt;li\u0026gt;■ 要素a abcdefgh\u0026lt;/li\u0026gt;

\u0026lt;li\u0026gt;□ 要素BB あいうえおかきくけこ\u0026lt;/li\u0026gt;

\u0026lt;/ul\u0026gt;

\u0026lt;/div\u0026gt;



要は ul 要素の幅を「fit-content」と内容に合わせ、右マージンを「0」にしてしまえば良いわけで......。