Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

table caption goes bottom using bootstrap

Table caption is at the top of the table but when I use a bootstrap class it goes to bottom of the table.

<table class="table table-bordered">     <caption>why?</caption>     <tr>         <th>1</th>         <th>2</th>         <th>3</th>     </tr>     <tr>         <th>4</th>         <td>5</td>         <td>6</td>     </tr> </table> 

How do I align it to the top of table?

like image 202
Ali Rasooli Avatar asked Feb 06 '18 16:02

Ali Rasooli


People also ask

How do I center a table header in bootstrap?

By adding the ” text-center” class of Bootstrap 3 We can use the “text-center” class of bootstrap 3 for the center-alignment of an element. So in our td when we add “text-center” class, and then our table text goes to the center.

How do you add a caption on top of a table in HTML?

The <caption> tag defines a table caption. The <caption> tag must be inserted immediately after the <table> tag. Tip: By default, a table caption will be center-aligned above a table.

How do you put a caption at the bottom of a table in CSS?

To put the caption below the table we can use the CSS caption-side property. This property is used to specify the position where the table caption is placed. It is used in HTML Tables. This property can be used with any element whose display property set to caption-side.

What is table responsive in bootstrap?

The .table-responsive class creates a responsive table. The table will then scroll horizontally on small devices (under 768px).


1 Answers

That's because bootstrap 4 has default caption css style - caption-side: bottom

When you change caption-side: top; you will have your caption on the top of the table.

like image 136
Mile Mijatović Avatar answered Sep 21 '22 10:09

Mile Mijatović