html - Keep images with size set to percentage on the same scale with window resize -
i building web app. size of images set using percentages. have 3 images overlapping image used toolbar. when have images display browser on full screen, fine. however, when have them displayed screen smaller, ratio of image size screen seems change. can change this?
full size:
smaller size version:
notice difference in size of icons.
my code:
<div id="bottombar" data-position="fixed"> <img id="ico" class="foodico" src="images/icons/food1.png" width="3%"> <img id="ico" class="shopico" src="images/icons/shop1.png" width="3%"> <img id="ico" class="activityico" src="images/icons/activity1.png" width="3%"> <img id="bbackground" src="images/icons/navbarbackground.png" width="100%" height="7.8%"> </div>
if set height
set amount, won't become smaller unless container they're in has height
attribute reduced.
Comments
Post a Comment