Right align and left align text in same HTML table cell

Question

I have a cell in an HTML  lt table gt   I would like part of the cell contents to be left justified and part to be right justified   Is this possible

User · Answer

It is possible but how depends on what you are trying to accomplish  If it s this     Left-aligned nbsp  nbsp  nbsp  nbsp  nbsp  nbsp  nbsp Right-aligned   in one cell then you can use floating divs inside the td tag    lt td gt   lt div style  float  left  text-align  left  gt Left-aligned lt  div gt   lt div style  float  right  text-align  right  gt Right-aligned lt  div gt   lt  td gt    If it s   Left-aligned  nbsp  nbsp  nbsp  nbsp  nbsp  nbsp  nbsp  nbsp  nbsp  nbsp  nbsp  nbsp  nbsp  nbsp  nbsp  nbsp  nbsp  nbsp  nbsp  nbsp  nbsp  nbsp  nbsp  nbsp  nbsp  nbsp  nbsp  nbsp  nbsp  nbsp  nbsp  nbsp  nbsp  nbsp  nbsp  nbsp  nbsp  nbsp  nbsp  nbsp  nbsp  nbsp  nbsp Right Aligned    Then Balon s solution is correct   If it s    Left-aligned nbsp  nbsp  nbsp  nbsp   nbsp  nbsp  nbsp Right-Aligned    Then it s    lt td align  left  gt Left-aligned lt  td gt   lt td align  right  gt Right-Aligned lt  td gt

User · Answer

I came up with this while trying to figure out how to display currency      to left  number to right  in table cells    lt div class  currency  gt 20 34 lt  div gt    currency      text-align  right      currency before      content          float  left     padding-right  4px

User · Answer

Tor Valamo s answer with a little contribution form my side  use the attribute  nowrap  in the  td  element  and you can remove the  width  specification  Hope it helps    lt td nowrap gt     lt div style  float left   gt this is left lt  div gt     lt div style  float right   gt this is right lt  div gt   lt  td gt

User · Answer

You could use something like    lt td gt      lt div style  float left width 49  text-align left   gt this is left lt  div gt      lt div style  float right width 49  text-align right   gt this is right lt  div gt    lt  td gt    The 49  is to give some room for the renderer to wrap things around   And you can use either  lt div gt  or  lt span gt

User · Answer

td style is not necessary but will make it easier to see this example in browser   lt table gt    lt tr gt     lt td style  border  1px solid black  width  200px   gt     lt div style  width  50   float  left  text-align  left   gt left lt  div gt     lt div style  width  50   float  left  text-align  right   gt right lt  div gt     lt  td gt    lt  tr gt   lt  table gt

User · Answer

If you want them on separate lines do what Balon said  If you want them on the same lines  do    lt td gt     lt div style  float left width 50    gt this is left lt  div gt     lt div style  float right width 50    gt this is right lt  div gt   lt  td gt

User · Answer

Do you mean like this    lt  --     --- gt   lt td gt     this text should be left justified    and this text should be right justified   lt  td gt   lt  --     --- gt    If yes   lt  --     --- gt   lt td gt      lt p style  text-align  left   gt this text should be left justified lt  p gt      lt p style  text-align  right   gt and this text should be right justified  lt  p gt   lt  td gt   lt  --     --- gt

[html] Right align and left align text in same HTML table cell

Examples related to html

Examples related to css