Почему мое изображение переполняется при определенной максимальной ширине, но работает нормально с определенной шириной? ⇐ CSS

[Anonymous]

Когда у меня задан стиль ширины изображения, равный 100 % родительского, изображение не переполняется. Но когда я определяю максимальную ширину как 100% от родительской, она переполняется. Вот мой простейший рабочий пример:
HTML:

Код: Выделить всё

Image Test






[img]square.svg[/img]

SVG:

Код: Выделить всё

Почему он это делает? Моя главная проблема в том, что у меня есть изображение, которое иногда больше родительского; и когда изображение меньше родительского, я не хочу, чтобы оно растягивало изображение, поэтому установка ширины на 100 % невозможна.

Подробнее здесь: https://stackoverflow.com/questions/797 ... h-a-define