Add horizontal ruler (line) after each section using CSS and Bootstrap in ASP.Net

George616
 
on Dec 03, 2020 03:45 AM
1113 Views

Hello Forum,

Please how can I create something like this as shwon in the screenshot below and make it responsive?

it has lines after each section

 

Download FREE API for Word, Excel and PDF in ASP.Net: Download
dharmendr
 
on Dec 03, 2020 03:49 AM
on Dec 03, 2020 03:50 AM

Hi George616,

Use bootstrap to design the page. For line use <hr /> tag and apply style to it.

<style>
    hr {
      margin-top: 1rem;
      margin-bottom: 1rem;
      border: 0;
      border-top: 1px solid rgba(0, 0, 0, 0.1);
    }
</style>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" />
<p>
   Text 1
   <hr/>
   Text 2
   <hr class="mt-5 mb-5">
</p>

Demo