I am trying to make the data that are in the column 'Address' to not have margin. To begin from the left because they overflow. The html , css, and js code is here

I don't know why but I also tried the

<td align="left">..</td>

but it didn't worked. Something in css code is blocking me to make this change.

and here I would like the two texts to be in the same line ,down in the page , because the one text is changing, but I can't make it together

I am trying to make the data that are in the column 'Address' to not have margin. To begin from the left because they overflow. The html , css, and js code is here

I don't know why but I also tried the

<td align="left">..</td>

but it didn't worked. Something in css code is blocking me to make this change.

and here I would like the two texts to be in the same line ,down in the page , because the one text is changing, but I can't make it together

• javascript
• jquery
• html
• css

• Please update your answer to include your html and css in a working code snippet in your answer. – Soviut Commented Nov 28, 2016 at 15:30
• add a class withpadding-left:0px!important; to that column – RonyLoud Commented Nov 28, 2016 at 15:35

5 Answers 5

Don't try to set alignment in your HTML, set it in your css. You'll need to set text-align to left and set the padding to 0 on both th and td elements.

table, th, td {
  border: solid 1px #CCC;
}

table {
  width: 100%;
}

th, td {
  padding: 0;
  text-align: left;
}

<table>
  <tr>
    <th>first</th>
    <th>second</th>
  </tr>
  <tr>
    <td>first</td>
    <td>second</td>
  </tr>
  <tr>
    <td>first</td>
    <td>second</td>
  </tr>
</table>

You need to remove the padding on the address cells.

And for the second point you juste need to add a display:inline-block http://jsfiddle/6v67a/1484/

I worked on you code. If you want the change to happen only on cells in the address Here is an easy fix. Add a class to the table cells you want to be changed and add this code to the css . It works

.classadded{
padding-left: 9px !important;
white-space: normal;
}

Here is a working fiddle

In case you want to make all td, th text left align then you can use this:

div#users-contain table td,
div#users-contain table th {
  border: 9px solid #eee;
  padding: .6em 220px .6em 20px ;
}

or if you want different for TD and TH then use this:

div#users-contain table th {
  border: 9px solid #eee;
  padding: .6em 120px;
}

div#users-contain table td {
  border: 9px solid #eee;
  padding: .6em 220px .6em 20px ;     
}

The align attribute is not supported in HTML5. Use CSS instead https://www.w3schools./tags/tryit.asp?filename=tryhtml_tr_align