Welcome to OStack Knowledge Sharing Community for programmer and developer-Open, Learning and Share
Welcome To Ask or Share your Answers For Others

Categories

0 votes
265 views
in Technique[技术] by (71.8m points)

html - 如何使用 <br> 在引导卡中标记?(How to use <br> tag in bootstrap card?)

I want to break the line after Other online payment.

(我想在“其他在线付款”后中断。)

but when I added <br> tag this starts making problems in the card content alignment.

(但是,当我添加<br>标记时,这开始使卡内容对齐方式出现问题。)

I'm using bootstrap.

(我正在使用引导程序。)

any idea why?

(知道为什么吗?)

thank you :)

(谢谢 :))

 .user-ads { font-size: 14px; text-align: left; margin-left: -55px; } .user-ads li { position: relative; padding-bottom: 17px; padding-left: 25px; } .user-ads li span { float: right; } 
 <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous"> <script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js" integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js" integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" crossorigin="anonymous"></script> <div class="card" style="width: 32rem;"> <div class="card-body"> <ul class="user-ads"> <li><strong>Seller </strong><span>tempestblaze</span></li> <li><strong>Payment method </strong><span><a href="">Other online payment:</a> Koho App</span></li> <li><strong>Price/BTC </strong><span>1,233,775.89 PKR</span></li> <li><strong>Limits </strong><span>10,000 - 62,538 PKR</span></li> <li><span><a class="btn btn-primary" href="">Buy</a></span></li> </ul> </div> </div> 

  ask by UmerLachi translate from so


与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome To Ask or Share your Answers For Others

1 Answer

0 votes
by (71.8m points)

Try this.

(尝试这个。)

I added a second break to prevent errors with overflow messing up your margins.

(我添加了第二个休息时间,以防止出现溢出错误而使您的利润率下降。)

I tested this on my on server and it looks good.

(我在服务器上测试了它,看起来不错。)

Kudos!

(荣誉!)

<div class="card" style="width: 32rem;">
    <div class="card-body">
      <ul class="user-ads">
          <li><strong>Seller </strong><span>tempestblaze</span></li>
          <li><strong>Payment method </strong><span><a href="">Other online payment:</a><br> Koho App</span></li>
          <br>
          <li><strong>Price/BTC </strong><span>1,233,775.89 PKR</span></li>
          <li><strong>Limits </strong><span>10,000 - 62,538 PKR</span></li>
          <li><span><a class="btn btn-primary" href="">Buy</a></span></li>
      </ul>
    </div>
</div>

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome to OStack Knowledge Sharing Community for programmer and developer-Open, Learning and Share
Click Here to Ask a Question

...