<table align="">
- Attribute of
- Create An HTML Table Quickly & Easily With Our Code Example
- What does
<table align="">
do? - Was used to align an HTML table to the left, right, or centered relative to the parent element. This attribute has been deprecated and CSS should be used to control the position of a table.
Code Example
<table align="right" style="width: 100px;">
<tr><td>First column</td><td>Second column</td><td>Third column</td></tr>
<tr><td>First column</td><td>Second column</td><td>Third column</td></tr>
<tr><td>First column</td><td>Second column</td><td>Third column</td></tr>
</table>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean gravida nibh nec massa dapibus, sed malesuada nisi posuere. Integer auctor faucibus sapien.</p>
<p>Sed ut magna in massa efficitur aliquam. In quis lorem arcu. Aenean dignissim molestie dolor nec laoreet. Proin eu massa a mauris molestie laoreet et vel nibh. Vestibulum quis odio ac turpis lobortis ultricies.</p>
First column | Second column | Third column |
First column | Second column | Third column |
First column | Second column | Third column |
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean gravida nibh nec massa dapibus, sed malesuada nisi posuere. Integer auctor faucibus sapien.
Sed ut magna in massa efficitur aliquam. In quis lorem arcu. Aenean dignissim molestie dolor nec laoreet. Proin eu massa a mauris molestie laoreet et vel nibh. Vestibulum quis odio ac turpis lobortis ultricies.
Controlling Table Positioning
Be default, a line break will appear both before and after a table. The align
element could be used to break the table out of its standard behavior and position it to the left or right of the parent container while sibling content moved up next to the table. The align
attribute has been deprecated. However, you can accomplish the same thing with CSS and the float
property.
<style> table.example-table { width: 100px; float: right; } </style> <table class="example-table"> <tr><td>First column</td><td>Second column</td><td>Third column</td></tr> <tr><td>First column</td><td>Second column</td><td>Third column</td></tr> <tr><td>First column</td><td>Second column</td><td>Third column</td></tr> </table> <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean gravida nibh nec massa dapibus, sed malesuada nisi posuere. Integer auctor faucibus sapien.</p> <p>Sed ut magna in massa efficitur aliquam. In quis lorem arcu. Aenean dignissim molestie dolor nec laoreet. Proin eu massa a mauris molestie laoreet et vel nibh. Vestibulum quis odio ac turpis lobortis ultricies.</p>
Here’s what your browser thinks that code should look like.
First column | Second column | Third column |
First column | Second column | Third column |
First column | Second column | Third column |
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean gravida nibh nec massa dapibus, sed malesuada nisi posuere. Integer auctor faucibus sapien.
Sed ut magna in massa efficitur aliquam. In quis lorem arcu. Aenean dignissim molestie dolor nec laoreet. Proin eu massa a mauris molestie laoreet et vel nibh. Vestibulum quis odio ac turpis lobortis ultricies.