css - Keep <img> always at the end of text line -


is there css workaround make pdf/doc/ppt icon sit @ end of text line, without using background image? when there not enough space icon image, sit in second line alone. i'm wondering if there similar white-space:nowrap?

<ul>     <li>         <a href="v1.pdf">lorem ipsum simaorem ipsum.  (3mb, pdf)</a>         <img src="images/pdf.gif" />     </li> </ul> 

<ul> has fixed width.

images text, or “inline content,” perspective of layout. thus, can use same techniques preventing line breaks in text. nobr markup prevents line breaks , works universally in browsers, though standards-writers have frowned upon it. if needed can use standardized, less reliable, more verbose sister: white-space: nowrap in css, inline markup span.

here problem need “overlapping” markup: ... (3mb, <nobr>pdf)</a><img ...></nobr> (i.e., open nobr element inside a element close a before nobr). while works, violates html syntax rules, i’d suggest move text out of a element (it not need there):

<a href="v1.pdf">lorem ipsum simaorem ipsum.</a>  (3mb, <nobr>pdf) <img src="images/pdf.gif" alt=""></nobr> 

or

<a href="v1.pdf">lorem ipsum simaorem ipsum.</a>  (3mb, <span  style="white-space: nowrap">pdf) <img src="images/pdf.gif" alt=""></span> 

Comments

Popular posts from this blog

jasper reports - Fixed header in Excel using JasperReports -

media player - Android: mediaplayer went away with unhandled events -

python - ('The SQL contains 0 parameter markers, but 50 parameters were supplied', 'HY000') or TypeError: 'tuple' object is not callable -