jQuery / CSS - обнаружение переполнения без прохождения всех элементов

Мое предположение заключается в том, что вы видите эту проблему, потому что существует конфликт между высотой, которую вы дали ей, и пространством, которое на самом деле нужно для правильного отображения.

Что вы можете сделать, чтобы решить эту проблему:

• Воспроизвести с помощью свойства «Заполнение» кнопки. Это контролирует пространство между текстом и границами кнопок.
• Уменьшить размер шрифта.
• Не помещайте явную высоту на кнопку или, по крайней мере, придавайте ей высоту

Также, как упоминал Хайнци в комментариях, вы должны, конечно, использовать прописную букву X.

. Кстати, вот трюк, который вы можете использовать, если хотите, чтобы кнопка была надлежащим квадратом, и убедитесь, что кнопка получает необходимый размер.

<Button Padding="0" 
    Width="{Binding RelativeSource={x:Static RelativeSource.Self}, Path=ActualHeight}" 
    HorizontalContentAlignment="Center" VerticalContentAlignment="Center"
    FontSize="12" Content="X" />

Это эффективно позволяет кнопке решить, какую высоту ей нужно, а затем установить значение Width для этого расчетного значения.