Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to Position a table HTML?

Tags:

html

I am trying to have the table lower and more to the right to were it originally is. How can i do this? What are the attributes? Thanks!

like image 297
Harry Esses Avatar asked May 16 '12 01:05

Harry Esses


People also ask

How do I move a table to the center in HTML?

When adding a table to a web page, by default, it's aligned to the left side of the page or container, as shown below. The HTML source code for the table above is the following. To center this table, you would need to add ;margin-left:auto;margin-right:auto; to the end of the style attribute in the <table> tag.

How do I move a table to the left in CSS?

You can use two values top and left along with the position property to move an HTML element anywhere in the HTML document. Move Left - Use a negative value for left. Move Right - Use a positive value for left. Move Up - Use a negative value for top.


2 Answers

You would want to use CSS to achieve that.

say you have a table with the attribute id="my_table"

You would want to write the following in your css file

#my_table{
    margin-top:10px //moves your table 10pixels down
    margin-left:10px //moves your table 10pixels right
}

if you do not have a CSS file then you may just add margin-top:10px, margin-left:10px to the style attribute in your table element like so

<table style="margin-top:10px; margin-left:10px;">
    ....
</table>

There are a lot of resources on the net describing CSS and HTML in detail

like image 185
Brendan Cutajar Avatar answered Sep 21 '22 10:09

Brendan Cutajar


As BalausC mentioned in a comment, you are probably looking for CSS (Cascading Style Sheets) not HTML attributes.

To position an element, a <table> in your case you want to use either padding or margins.

the difference between margins and paddings can be seen as the "box model":

box model image

Image from HTML Dog article on margins and padding http://www.htmldog.com/guides/cssbeginner/margins/.

I highly recommend the article above if you need to learn how to use CSS.

To move the table down and right I would use margins like so:

table{
    margin:25px 0 0 25px;
}

This is in shorthand so the margins are as follows:

margin: top right bottom left;
like image 23
Hawken Avatar answered Sep 23 '22 10:09

Hawken