Template talk:ItemList CF

Not quite centered

I'm not sure if anyone has noticed, but after placing text in the table the headings are no longer center aligned. I believe this has something to do with the class="sortable" applied to allow the table to be sorted. The following is an example of the template as it currently operates, followed by a table with the 'class="sortable"' removed. Note that both of these templates appear correct in the preview tab but not live on the site (or when clicking the 'show preview' button). Also it's worth noting that the class="sortable" also seems to be modifying the font, I think it's a bit larger than the table with the class removed. That and neither table heading is actually vertically aligned within the cell (the text sits a bit towards the top), not sure how to fix this. --sunmarsh (talk) 16:19, July 15, 2014 (EDT)

Item Name	Buy Price	Sell Price	Available From	Color(s)	Genres	Size (sq)	Info
test	test	test	test	test	test	test	test

Item Name	Buy Price	Sell Price	Available From	Color(s)	Genres	Size (sq)	Info
test	test	test	test	test	test	test	test

After every |, add align="center"

{| align="center" width="80%" cellpadding="1px" style="border: 3px solid #FFDD66" 
! style="border: 0px solid; background:#FFDD66; color:#000;" | Item Name
! style="border: 2px solid #FFDD66; background:#FFFFCC; color:#666;" | Buy Price
! style="border: 2px solid #FFDD66; background:#FFFFCC; color:#666;" | Sell Price
! style="border: 2px solid #FFDD66; background:#FFFFCC; color:#666;" | Available From
! style="border: 2px solid #FFDD66; background:#FFFFCC; color:#666;" | Color(s)
! style="border: 2px solid #FFDD66; background:#FFFFCC; color:#666;" | Genres
! style="border: 2px solid #FFDD66; background:#FFFFCC; color:#666;" | Size (sq)
! style="border: 2px solid #FFDD66; background:#FFFFCC; color:#666;" | Info
|-
|align="center"|test
|align="center"|test
|align="center"|test
|align="center"|test
|align="center"|test
|align="center"|test
|align="center"|test
|align="center"|test
|}

So it looks like this.

Item Name	Buy Price	Sell Price	Available From	Color(s)	Genres	Size (sq)	Info
test	test	test	test	test	test	test	test

But I think the main problem is that the text is sort of a different size, but perhaps it's how you input the "test" text that makes it expand a bit? If you add a really long bit of text, what would happen?

Item Name	Buy Price	Sell Price	Available From	Color(s)	Genres	Size (sq)	Info
toiewjoijfiomfioejgiomrioqergmoqenmb	test	test	test	test	test	test	test

Hm, I don't understand why it would be off center, but with my temporary solution by adding align="center", the problem should be negligible. ™ 16:25, July 15, 2014 (EDT)

---

Mario the code that you copied is an altered version of the template in question here. It doesn't include the line class="sortable". I included this altered code to make my point, which is: without this line the table centers everything fine, as you noted... but then you can't sort the table by clicking a heading. --sunmarsh (talk) 16:31, July 15, 2014 (EDT)

The off-centering is caused by padding added to the cells to ensure there's room for the icons that indicate that the table can be sorted, which weren't being displayed because of the way that the background was colored. I unhid them here for now as an example--I'm not sure if hiding them was intentional or not--and they'll be shown where the template is in use. If the icons aren't wanted, we can re-hide them and remove the padding; we could also show them on the rest of the sortable tables if people find them useful. -Sky (talk) 21:30, July 15, 2014 (EDT)

Thank you so much for providing clarity! I was starting to think I was crazy lol... I personally find them helpful to designate which heading the table is being sorted by, that and so that it doesn't look like the headings are awkwardly centered. Also is there a sort icon for the dark yellow Item Name cell? --sunmarsh (talk) 21:43, July 15, 2014 (EDT)

Oh, gotcha. Thanks, Sky. ™ 21:48, July 15, 2014 (EDT)

Glad I could help, and I agree that they're helpful. There is an icon for the name column; thanks for catching that. -Sky (talk) 21:50, July 15, 2014 (EDT)