css - リスト項目の右に表示するカスタムの箇条書きイメージを取得できません

Question

各リスト項目のすぐ右側にあるチェック マークを箇条書きにして LIST を作成しようとしています。

リストはページの中央に配置する必要があります。

（グラフィックの例を投稿したはずですが、担当者はいません）。

これは、ページの中央に表示したいものです。

リスト項目 1 ✔
リスト項目 2 ✔
リスト項目 3 ✔

現在、私のリストはページの中央にありますが、チェック マークはページの右側にずっとあります。

これは私が今持っているものです（そして望んでいません）。

リスト項目 1 ✔
リスト項目 2 ✔
リスト項目 3 ✔

      <div class="welcome-text">

          <div class="welcome-text1">
                <ul class="certs">
                    <li>Licensed</li>
                    <li>bonded</li>
                    <li>insured</li>
                </ul>
          </div>

          <div class="welcome-text2">
                The BEST Choice For Quality Termite Pest &amp; Lawn Care! Protecting your home starts with a free inspection.
          </div>

  </div>

上記の CSS は次のとおりです。

.welcome-text{
    padding-top:30px;
    margin:0 auto;
    width:80%;
    overflow:hidden;

}

.welcome-text1{
    color:#333333;
    font-family:Open Sans Condensed;
    text-transform:uppercase;
    font-size:24px;
    line-height:30px;
}

.welcome-text1 ul{
    list-style-type: none;
    margin-left: 0;
}

.welcome-text ul li{
    display:block;
    background-color:#CCC;
    background: url(images/checkmark.png) right center no-repeat;

}

.welcome-text2{
    color:#777;
    font-family:tahoma;
    font-size:18px;
    line-height:20px;
}


.certs li{
    list-style: none;
    padding:3px;
    margin:0;

}

何か案は？

ティア

Answer 1

箇条書きを右側に表示するだけの場合は、単に使用できます

<ul dir="rtl" type="disc">

次に、 list-style-type などを使用して画像ごとに箇条書きを変更するだけです...それで問題が解決すると思います。

Answer 2

ulタグに幅を与えるだけで完了します