установить изображение SVG и img с минимальной шириной в%

Question

Можно ли установить SVG-изображение с минимальной шириной в%? потому что он не работает для меня. То же самое для изображения. Оба установлены так, чтобы соответствовать 100% содержащего div. Когда я изменяю размер моего браузера, я хочу, чтобы изображение останавливало изменение размера, когда оно достигает минимальной ширины.

HTML

<div id="first"> 
    <img href="" alt="si"/> 
</div> 

CSS

#first{ 
    background-color:black; 
    width:100%; 
    height:30%; 
    position:fixed; 
    overflow:hidden; 

} 
#first img{ 
    width:100%; 
    min-width:50%; 
} 

Answer 1

% относительно ширины родителя div, а для внешнего самого div - относительно ширины браузера.

Предположим, вы хотите, чтобы изображение не должно получить меньше, чем 200px, используйте скрипт ниже

#first img{ 
    width:100%; 
    min-width:200px; 
} 

Вот если #first ширина больше 200px, чем масштаб изображения или остается 200px мин.

Answer 2

first является родителем для вашего изображения и его ширина width:100%. Однако минимальная ширина вашего изображения составляет 50%, а процентные значения относятся к родительскому элементу, поэтому в этих обстоятельствах ваше предпочтение не представляется возможным.