質問: タイトル1 ・ 文章1 結果1 ・ 文章0000 結果2 ・ 文章10 結果3 タイトル2 ・ 文章3 結果1 ・ 文章199 結果2 ・ 文章2 結果3 少しずれてしまっていますが、上記のような箇条書き文を作成しています。 色々調べてやってみているのですが、黒丸の点を入れて作成しようとするうまくいかず... ご教示のほど、宜しくお願いいたします! 追記:画像を添付いたしました。 上の画像のものでは一列ずれて表示される。 下の画像では、行が空き過ぎてしまう。を無くしてもうまく表示されませんでした。 ![![イメージ説明](https://teratail-v2.storage.googleapis.com/uploads/contributed_images/a995c22f1bbf77155344edf64656e5e3.png)] ![イメージ説明](https://teratail-v2.storage.googleapis.com/uploads/contributed_images/3d9c05c534232471346680ec5f379ffd.png)
回答: こういう場合は CSSでやると思います。 私なら、 例えば 文章用クラス: textc 結果用クラス: resc としておきます。 textc の width を 例えば 100px, resc の width は 200pxとし、 両方ともtext-alignを center にしておく。 ...みたいに自分のイメージになるようにやっていく。 そして、HTML側ではspan辺りにclassを付与して囲む。 ``` span.textc{ with: 100px; text-align: center; } span.resc{ with: 200px; text-align: center; } ``` ``` 文章1結果1 文章2結果2 ``` textc と resc の間に1px以上空けたいなら padding とか marginとかで制御。 もし、そのままだと ``` ・文章1 結果1 ・文章2 結果2 ``` のように改行してしまうなら、横に並ばせるためにfloat ( もちろんCSS ) で制御。