Html Question posted in
Some basic documentation can be found here.

How to put a column in html file in printing of pdf document

I want to create a document in html file to print in a pdf format, but the column didn’t work.
Do I need to have a library?

Tags:

2

Answers


  1. 0

    Here is the sample code using which you can add as many rows and columns you want based on you data. In this example, I have defined a three-column layout. you can add as many columns as you wish by specifying the repeat() function.

    Example: grid-template-column: repeat(3, 1fr) will do same thing as grid-template-columns: 1fr 1fr 1fr;

    In the below example, the grid-template-columns property defines three columns for the grid container and every column has a fixed width of 1 fraction of the available space,

    <!DOCTYPE html>
<html>
<head>
  <style>
    /* Define a three-column layout */
    .row {
      display: grid;
      grid-template-columns: 1fr 1fr 1fr;
    }
    
    
    /* Style the contents of each column */
    .column {
      background-color: #f2f2f2;
      padding: 10px;
      border: 1px solid black;
    }
  </style>
</head>
<body>
  <div class="row">
    <div class="column">
      <p>Data1</p>
    </div>
    <div class="column">
      <p>Data2</p>
    </div>
    <div class="column">
      <p>Data3</p>
    </div>
  </div>
  
  <div class="row">
    <div class="column">
      <p>Data1</p>
    </div>
    <div class="column">
      <p>Data2</p>
    </div>
    <div class="column">
      <p>Data3</p>
    </div>
  </div>
  
</body>
</html>
    Login or Signup to reply.
  2. 0

    You can use the bootstrap library, check this : https://getbootstrap.com/docs/5.0/layout/columns/

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search