HTML / CSS / JAVASCRIPT - scaling fixed sized items to fit into a fluid container
I was wondering if anyone else has hit this problem? My goal is to scale some fixed sized divs with text and images to fit within a fluid div container. Here is a more detailed explanation:
I have to give an as accurate as possible preview of a print layout in HTML so I am setting my item sizes to MM for dimensions and to PT for text, this allows me to copy an existing print layout accurately. Now开发者_高级运维 my problem is that I need these page previews to fit in a div which would be set to say 80% height. I am struggling with this one as I can't think of an easy way to convert lots of MM and PT measurements into percentages, So I thought maybe there could be some involvement of JavaScript?
Any help would be appreciated.
Jquery and CSS where used to solve this in the end. There is a css property named zoom. This can be increased or decreased using the below example:
$('.zoomMinus').click(function ( ){
zoom -= 10;
$("#divtozoom").css('zoom', zoom + "%");
});
$('.zoomPlus').click(function ( ){
zoom += 10;
$("#divtozoom").css('zoom', zoom + "%");
});
精彩评论