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

Post a Comment