StackOverflow2013

Note that there are some explanatory texts on larger screens.

plurals

POSet a group of <span>'s position based on the lowest <span> in a table jQuery
text
Body
copied!<p><strong>EDIT 3</strong> Can I get some more jQuery suggestions please? I've tried so many different CSS options, but Mozilla doesn't seem to want to cooperate, I would like to do something that I know will work...</p> <p>So I have this 2 row table and I am trying to get the Picture caption to all be at the same height while leaving the picture centered in the <code><td></code>, and I am thinking that the best way to do this is using jQuery and the <code>offset()</code> function. However, I am not really sure about where to get started with this and looping through each <code><td></code> in the table.</p> <p><strong>EDIT:</strong> Trying to keep the images centered in the <code><td></code> so <code>vertical-align: bottom</code> unfortunately won't work...</p> <p><strong>EDIT 2:</strong> I also use 2 different styling sheets... one for IE and then one for everything else... the IE is fine, because I can set <code>position: relative</code> to my <code><td></code> and everything still works... the styling sheet for everything else it doesn't work for because in Firefox if I set it to position relative it ends up stacking all of the captions one on top of each other and places it in lala land. So, is there a way to include in a jQuery script <code>if browser != IE then...</code>?</p> <p>I guess here is my mental process in how I want to try and go about doing this...</p> <p><strong>Outline:</strong></p> <p>For each <code><tr></code> go through every <code><td></code>...in each <code><td></code> get the lowest y position of the span</p> <p>When there are no more <code><td></code>'s in the <code><tr></code> go through the row 1 more time and set all of the spans y position equal to the lowest y position found earlier.</p> <p>Then go to the next row.</p> <p><strong>Fiddle:</strong> <a href="http://jsfiddle.net/58u4g/14/" rel="nofollow">http://jsfiddle.net/58u4g/14/</a></p> <p>I am a bit ashamed to be putting a fiddle up here without any jQuery code in it especially when I am asking for it, but I have yet to try looping in jQuery, especially looping through the rows of a table... Still doing some research on it, but I figured I would see what all of your thoughts were.</p> <p>Thanks in advance for all the help!</p>

Querying!

Guidance

An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload