Admin Forum:No Break?

How would I go about keeping two objects (an image and a parameter) together? Nothing I've found seems to work how I want. I'll use some random image as an example. ...yields this: Text. The problem is, sometimes the template is spaced just so in an article that the line wraps between the image and the text. How do I prevent this?


 * Hi. You could use  Which renders a non-breaking-space, like so: 257.png Text. :) STARFLEET ACADEMY  07:38, June 5, 2012 (UTC)


 * That's just the thing... in the case of my template, using a space of any kind would ruin the alignment. I was hoping for a way to somehow "bind" the image and parameter together, if possible.


 * Eek, I'm not quite sure what you mean. May I have a link to the template? :) STARFLEET ACADEMY 08:22, June 5, 2012 (UTC)

┌───────┘ Link. I'm looking for a way to prevent the image and unnamed parameter #1 from separating (via line wrap) under any circumstance, preferably without using a table of some kind. If there's no other option, that may be what I'll have to go with.


 * Hmm. Have you thought about using CSS? My idea: Remove the image completely, and then give the  a spanned class, then add the image before:


 * STARFLEET ACADEMY 08:41, June 5, 2012 (UTC)


 * Hm, I'll test that. Thanks :).


 * I'll have a look into it too. Sorry about the typo. :P STARFLEET ACADEMY 08:45, June 5, 2012 (UTC)


 * I was right the first time! Try this:


 * It works for everything from 2 to 500! :D STARFLEET ACADEMY 09:05, June 5, 2012 (UTC)


 * Thanks for the code. I think later I'll try working out a CSS implementation, so it'll load faster. I think there should be a way to do it using the :before pseudo-element, but I can't get it to work (I have no experience in this).

Yeah, load times can be a pain with js. Try this (I haven't got time to test it):

I haven't used :before myself though! :) STARFLEET ACADEMY 10:21, June 5, 2012 (UTC)


 * What about ~ Flightmare 11:51, June 5, 2012 (UTC)


 * Yep, I tried both of those. The CSS doesn't work (not sure why) and the wrap:none selector creates a whole new line.


 * " " is not a valid CSS property. Flightmare's code created a new line because the  tag is a block level element. Instead, you should use the CSS code   inside of a   tag, like this:


 * --Gardimuer { ʈalk } 21:45, June 5, 2012 (UTC)

┌───────┘ That works perfectly, Gardimuer. Thanks to all who posted.