javascript - How to prevent linebreaks after an inline image? -


I have noticed that my browser is a and lt; Img & gt; You can set a line break after the tag, even if the image tag & amp; Nbsp;

  & lt; P style = "width: 12x; font-family: monospace;" & Gt; 12345678 & lt; Img style = "width: 2x" src = "https://upload.wikimedia.org/wikipedia/commons/thumb/8/85/Smiley.svg/25px-Smiley.svg.png" & gt; & Amp; Smiley should be on the second row, because the image tag is followed by ; 123       nbsp; . I  : 

with & lt; Span & gt; can force this behavior = "JS" data-hide = "false">
  & lt; P style = "width: 12x, font-family: monospace;" & gt; 12345678 & lt; Span style = "white-space: nowrap" & gt; & Lt; Img style = "width: 2x" src = "https://upload.wikimedia.org/wikipedia/commons/thumb/8/85/Smiley svg / 25px-Smiley.svg.png" & gt; & Nbsp; 123 by & lt; / Span & gt; & Lt; / Span & gt; & Lt; / P & gt;  

Do any additional & lt; Span & gt; Is there a solution by adding tags? For example: To prevent line breaks after this, & lt; Img & gt; Is there a CSS statement for ?

Note: & lt; P & gt; should not be changed, I only use it to emulate the problem.

Yes, just use the display of CSS: inline-block < / P>

  img {display: inline-block; }  
  & lt; P style = "font-family: monospace;" & Gt; Some time ago & lt; IMG style = "width: 2x" src = "https://upload.wikimedia.org/wikipedia/commons/thumb/8/85/Smiley.svg/25px-Smiley.svg.png" & gt; & Amp; Nbsp;  p  is quite broad, so it ensures that it needs to be wrapped up (I have removed the  width  style) 

It does not work in Firefox 33


Comments