Newline in <Td Title="">

newline in td title=

This should now work with Internet Explorer, Firefox v12+ and Chrome 28+

<img src="'../images/foo.gif'" 
alt="line 1 line 2" title="line 1 line 2">

Try a JavaScript tooltip library for a better result, something like OverLib.

How can I use a carriage return in a HTML tooltip?

It’s simple: just press Enter!

<a href="#" title='Tool
Tip
On
New
Line'>link with tip</a>

How to show multiline text in a table cell

You want to use the CSS white-space:pre applied to the appropriate <td>. To do this to all table cells, for example:

td { white-space:pre }

Alternatively, if you can change your markup, you can use a <pre> tag around your content. By default web browsers use their user-agent stylesheet to apply the same white-space:pre rule to this element.

The PRE element tells visual user agents that the enclosed text is "preformatted". When handling preformatted text, visual user agents:

  • May leave white space intact.
  • May render text with a fixed-pitch font.
  • May disable automatic word wrap.
  • Must not disable bidirectional processing.

Wrap the table cell content at newline character

If you got the string from a database, there are two ways to accomplish this:

To replace \n's with html breaks:

echo str_replace("\n", "<br>", $string);

To see \n's as they are:

echo '<pre>' . $string . '</pre>';

There are also a css solution, apply this rule to the container:

white-space:pre;

Add line break within tooltips

Just use the entity code for a linebreak in a title attribute.



Related Topics



Leave a reply



Submit