BBCode for a "Progress Bar"

So, those progress bars that are used for things like the amount of steps until an egg hatches/Pokemon levels, amount of time remaining on a task, or the amount of garden EXP needed to reach the next level, etc. They're pretty nifty, and I think it'd be neat if you could use them to post a fancy-looking progress bar for your own custom purposes in a forum post or "about me" introduction using a new BBCode tag. I'm sure users would find plenty of use out of them for (manually) tracking the progress of their shiny hunts, overall dex completion, the work that needs to be done on a piece of art or fanfiction chapter, the list goes on. And, seeing as they're already everywhere, I wouldn't think they'll be too hard to implement as a user-postable thing. Here's an example of how the tag might work: [progressbar="X/Y"]Text inside bar[/progressbar] Where X is the current value and Y is the max value. [progressbar="25/100"]Dex completion: 25%[/progressbar] would make a progress bar that's 1/4 of the way full and says "Dex completion: 25%" inside of it. Ideally, X and Y could be any numbers as long as the former is equal to/lesser than the latter. However, if it'd be too complicated to implement/use that way, it could require only a single argument, and the maximum could be a constant value like 100, making X a percentage. The above example would then become: [progressbar="25"]Dex completion: 25%[/progressbar] In that case, a number less than 0 or not a number would likely be treated as 0, and a number greater than 100 would be treated as 100. And that is all. I just figured it'd be a nice option for users to easily visually convey a percentage of something, as well as pretty up their posts/intros without having to use images or complex BBCode wizardry.

This (or something very much like it) was something they had over at PF1, not sure if you were there or not. But perhaps in time, Niet will make this feature here.

I'll see about maybe adding it, but in the meantime you can reproduce it (using default skin colours - customise as desired) like so: Code: ... Huh, that's a lotta code! But it looks cool =3

That is great! Now if only I could figure out how to have it not always be centered :P

Try replacing `margin:5px auto` (right at the start) with `display:inline-block` - you might still want to use `margin:4px` or something to give it a bit of breathing space.

Oh. I didn't actually know that. I might have been on PF1, but if I was, it was so long ago and/or for so little time that I never knew about the feature. Well anyway, thanks for the code, and sorry for clogging the submission forum :'L

Thank you for answering Eltafez :) Hopefully one day it wont be so temporary

If you look at the BBCode, you'll see that that's not possible. Hence it's a temporary solution.