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
Post a Comment