Question

I literally cannot comprehend why it does this, the size of the first td seems to absorb a portion of the size of the last td.

The id of the table is “slide-table”, http://www.rickpascua.cu.cc/.

This bug or w/e it is only occurs on Firefox and IE, Chrome shows it just fine with an equally distributed size.

Any help would be much appreciated!

(I should note this only occurred after I added a few .hide()‘s but none of them directly affect the “slide-table”.)

Answer 1

By default, the browser determines the width of table columns based on what’s in each td. So in your case, the width of each column depends on the images, which are all different sizes.

You can change that in the CSS by specifying:

#slide-table table {
    table-layout: fixed;
}

and also specifying a width for each column.

Or just make all the images the same width and height.