テキストの行の整列

divに6行のテキストがあります。各行は<li>タグ内にあります。テキストが縦に整列していません。テキストの行の整列

テキストを縦に揃える方法はありますか？

2017-08-17 Nees

を、あなたはダッシュを揃える意味しますか？はいの場合は、[Monospaced font]（https://en.wikipedia.org/wiki/Monospaced_font）を使用する必要があります。 – ponsfrilus

縦に整列しているようです。あなたは水平に並んでいないことを意味しましたか？ – litelite

ああ、そうです。私は水平に整列していることを意味する。しかし、垂直にも。ダッシュがお互いの下にあること。 – Nees

あなたは例えば、バージョンを揃える<code>タグを使うことができます。：

<b>Serie 1:</b> 
 
<ul> 
 
    <li><code>1.07a</code> - <a href="#">Lijnentekening</a>;</li> 
 
    <li><code>1.07b</code> - <a href="#">Gebouw</a>;</li> 
 
    <li><code>1.07c</code> - <a href="#">Precisietekening</a>;</li> 
 
    <li><code>1.07d</code> - <a href="#">Kunst</a>;</li> 
 
    <li><code>1.07e</code> - <a href="#">Meselwerk</a>;</li> 
 
    <li><code>1.07f</code> - <a href="#">Kozijndetail</a>;</li> 
 
</ul>

出典

2017-08-17 19:18:33 ponsfrilus

Thx、素晴らしいですね。しかし、クラスをコードタグに入れても、それは機能しません。私はそれについて何ができますか？ – Nees

'タグ'を、（少なくとも）以下を含むクラスで使用してください： 'font-family：monospace;' https://jsfiddle.net/s2k8zt1a/1/を参照してください。 – ponsfrilus

あなただけのように、ブートストラップまたはその軽量なものとしてそこにこの種のもののための素晴らしい解決策がある心に留め、そのような

<li> 
    <div style="width: 100px;display: inline-block;">text</div> 
    <div style="width: 25px;display: inline-block;">-</div> 
    <div style="width: 100px;display: inline-block;">more text</div> 
</li>

としてあらかじめ定義された幅でいくつかのスパンに<li>text - more text</li>要素を分割することができグリッドとテキストの配置を提供します。

出典

2017-08-17 19:13:11

答えて

関連する問題