FANDOM


m (reply)
Line 47: Line 47:
   
 
I haven't used :before myself though! :) [[User talk:Starfleet Academy|<span style="background:royalblue;border-radius:20px 0 0 20px;padding:4px;font-family:Century Gothic;color:#000">STARFLEET&nbsp;ACADEMY</span>]] 10:21, June 5, 2012 (UTC)
 
I haven't used :before myself though! :) [[User talk:Starfleet Academy|<span style="background:royalblue;border-radius:20px 0 0 20px;padding:4px;font-family:Century Gothic;color:#000">STARFLEET&nbsp;ACADEMY</span>]] 10:21, June 5, 2012 (UTC)
  +
:What about <pre><div style="wrap:none"></pre> ~ [[User:Flightmare|Flightmare]] 11:51, June 5, 2012 (UTC)

Revision as of 11:51, June 5, 2012

Forums: Admin Central Index Technical Help No Break?
Central's forums are a place for the community to help other members.
To contact staff directly or to report bugs, please use Special:Contact.
Note: This topic has been unedited for 2959 days. It is considered archived - the discussion is over. Do not add to unless it really needs a response.


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.

[[File:257.png|14px|link=]]{{{1|}}}

...yields this: 257Text. The problem is, sometimes the template is spaced just so in an article that the line wraps 257between the image and the text. How do I prevent this? Dzylon  Talk  07:07:43  June 05, 2012

Hi. You could use &nbsp; Which renders a non-breaking-space, like so: 257 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. Dzylon  Talk  08:10:04  June 05, 2012
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. Dzylon  Talk  08:27:30  June 05, 2012

Hmm. Have you thought about using CSS? My idea: Remove the image completely, and then give the {{{1|}}} a spanned class, then add the image before:
.class {
 padding-left: 14px;
 background: url('href');
}
STARFLEET ACADEMY 08:41, June 5, 2012 (UTC)
Hm, I'll test that. Thanks :). Dzylon  Talk  08:42:47  June 05, 2012
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:
$(function() {
 $('.gpicon').before('<img src="http://images2.wikia.nocookie.net/__cb20120517203404/infinityblade/images/a/a8/Gp-icon.png" />');
});
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). Dzylon  Talk  09:41:23  June 05, 2012

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

.class:before {
 background: url('http://images2.wikia.nocookie.net/__cb20120517203404/infinityblade/images/a/a8/Gp-icon.png');
}

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

What about
<div style="wrap:none">
~ Flightmare 11:51, June 5, 2012 (UTC)
Community content is available under CC-BY-SA unless otherwise noted.