CODEWITHSUNDEEP
csshtmltwitter-bootstrap
aceminer
aceminer

Reputation: 4295

Displaying text inline in html table

I would like to achieve this

Example of table

Number : 123
         456 
Mobile : 123

However i am achieving something like this

         123
Number : 456 
Mobile : 123

I am using <td> and <tr> in html.

How do I ensure that the cell is able to handle newline characters and display them as according to my first output 

.td-custom {
    border: 0px solid black;
    width: 200px;
}
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet"/>
<table class="tableContainer" cellspacing="100px">
  <tr>
    <td class="td-custom">Name:</td>
    <td class="td-custom">Name</td>
  </tr>
  <tr>
    <td class="td-custom">Status Message:</td>
    <td class="td-custom">Hey i am using ........... lololol
      <br>asda</td>
  </tr>
  <tr>
    <td class="td-custom">date:</td>
    <td class="td-custom">21st Jan 2015</td>
  </tr>
  <tr>
    <td class="td-custom">Remarks:</td>
    <td class="td-custom">Nil</td>
  </tr>
</table>

Upvotes: 0

Views: 580

Answers (1)

Dariusz Sikorski
Dariusz Sikorski

Reputation: 4407

A working example of @Thomas solution with

.td-custom {
  border: 0px solid black;
  width: 200px;
  vertical-align: top;
}

https://jsfiddle.net/ukq61zcb

Upvotes: 1

Related Questions