How to use css align for tables

Asked

Viewed 926 times

-3

Galley as I mount this table in css?

<table border="0" align="right">

I want to know how to align a table right using css.

4 answers

2


Try:

 table {
     float: right;
 }
  • Thank you very simple

0

Try to use this:

table {
    /*margin-right: 10%; /* distância até chegar em 100% (baseando-se no lado direito) */
    margin-left: 100% !important;/* distância até chegar em 100% (baseando-se no lado esquerdo) */
}

Jsfiddle:

https://jsfiddle.net/pxL6u3ay/

  • did not work. with the align="right" the table is leaned on the right corner of the monitor, as I need. and with its css it is almost on my screen

  • I edited my answer by putting example

  • still wrong buddy, I want the table to stick to the right corner. and it’s not getting.

  • It doesn’t even work by changing the margin-left to 100%?

  • If it doesn’t work, test put a ! Important, because another css file must be overwriting this.

  • @Hugoborges is not wrong, just don’t fit its use ;)

  • Take a look at this example. https://jsfiddle.net/pxL6u3ay/1/ I want it to stick to the right side, but without using align="right" I want to do this in css.

  • I only changed the margin-left to 100% and it worked perfectly: https://jsfiddle.net/pxL6u3ay/2/

  • 1

    @Hugoborges -> https://jsfiddle.net/pxL6u3ay/3/

  • 1

    The @Victorgomes example using the right property also works

Show 5 more comments

0

I believe the problem is that your page has margin or padding that does not allow your table "paste" on the right, try the solution below and adapt to the rest of your code so that your whole page does not break:

<table border="1" align="right">

CSS:

*{
    margin: 0px;
    padding: 0px;
}

0

So much to do in the following ways below, using float: right; if you want to put your table on the right, and if you want to align your text on the right inside the table, use text-align: right;.

table.table-1 {
  width: 100px;
  background: #ccc;
  float: right;
  margin-bottom: 10px;
}

table.table-2 {
  width: 100%;
  background: #ccc;
  text-align: right;
  clear: both;
}
<table class="table-1">
  <tr>
    <td>Tabela 1</td>
  </tr>
</table>

<table class="table-2">
  <tr>
    <td>Tabela 2</td>
  </tr>
</table>

Browser other questions tagged

You are not signed in. Login or sign up in order to post.