Admin Forum:Resize to maximum element

Forums: Admin Central Index → Technical Help → Resize to maximum element Wikia's forums are a place for the community to help other members. To contact staff directly or to report bugs, please use Special:Contact.

I have a series of inline-tables, like these:

The header cell's height can be various, so I want to make all the table (basically the captions) the same, equals to the maximum height of the series. I cannot wrap them under a container, or rather the tables are on more then one line, like this:

So I cannot find a solution with CSS only, how can I do it with JS?


 * This is about creating a template isn't it? If so, there's an extension named ImageSizeInfoFunctions which is apparently enabled on some Wikia wikis. If you can convince Staff to enable that extension for your wiki as well, you can solve this without JavaScript.


 * For a JavaScript solution you should use jQuery's height and css methods. --


 * I see, you've edited your code. So it's not the images that are causing problems but the text that accompanies them. Is that right? --


 * That's right, the images are all set to a fixed dimension, it's the caption that can cause troubles. Of course I can set an height tall enough for displaying two lines, for example, but I don't know if there will be captions longer. I just would like to have more solutions to choose from. I already saw those jquery functions, but I did not understand how I can search and store the height of the tallest caption...

If you assign all cells a fixed width and give them a common identifier - let's say a class named "stretchable" - then you could do it like so:

(untested) --

It works (better with ). Can I make it works differently for each tables? For example, if I have a situation like this: table.main tr td table.stretchable table.stretchable table.stretchable /td /tr tr td table.stretchable table.stretchable table.stretchable /td /tr /table Maybe it's better for each group to have its own max height. Last thing, do I need to make some corrections for monobook? Anyway it works fine even like this, thank you.


 * You could try this:


 * It's untested as well :P


 * I don't know much about Monobook, but I doubt it makes a difference. --


 * I remembered someone told me the monobook execute the js before the loading of the page, so some code must be placed in a dummy function that will be executed after the page is loaded . I'll try that, thank you again.


 * This code is unlikely to work before the page has fully loaded. That's true under Oasis, under Monobook and under any other skin. That's true on any web page - wiki or not. That's why it's wrapped in the ready function:


 * does the exact same thing. --


 * The second code doesn't work, but I guess the first one is enough.


 * It should work! I didn't have the patience to set up a test page though. If you can point me to an example page, I'll fix it. --


 * I'm testing here, but the first code is fine, thank you.


 * There are no elements of class "stretchable" on that page. But whatever. If you say the first code is good enough... --


 * " " is a class you invented on your own! : ) My target class is, of course I substituted it in your code and the second one didn't work.

Ah, I see. Well, I never would have guessed what your actual output looks like! Of course, my code didn't work. Che sorpresa! :)

Try this then:

I don't know how much of this you can read, but it's written under the assumption that there are tables with the class "galleria-main" that contain tables of class "galleria-cella" with cells of class "galleria-didascalia". As long as your code satisfies those assumptions, this JavaScript won't break. --


 * It works great! Thank you.