I’m honouring stack overflow with my first ever on line web building question…
My challenge to myself; content must fill the window, whatever size/orientation, and up to pretty extreme aspect ratios in both directions (landscape/portrait). The images must follow suit, but I don’t what space appearing around them – they must stay just big enough to fill and be cropped/overflow/be hidden but (importantly) no bigger. One other thing; no scroll bars anywhere.
My (partial) solution for this has brought me to the end of my resources and it really is a bodge… Here it is; http://generationsinc.co.uk/test/wellies fluid image.html this should give you an idea, so long as you don’t try view it in IE… Restore down and drag the corner around…. (I’m hoping that this may mean it’ll look good on whatever screen, pad, phone, whatever way it is held? – I’ll split up and reduce any text so’s it won’t cause trouble.)
My question: is there a better way of doing this, or how can it work with IE, and the crossSlide I’m using.
Should I use flash instead? Does flash allow itself to be resized and ‘cropped’? I s’pose it could be v slow at this size? (Tell me if I should be starting more questions.)
Thank you very much for this. I first discovered HTML 16 months ago and after much scratching around on the web got our website http://generationsinc.co.uk together for Xmas 2010. It is now very overdue for a complete overhaul, I can generally find answers to my questions but, despite many hours on IE/CSS rants and trying various scripts that try and convince IE to achieve, this one has stumped me, I don’t know what to search for.
If you’re looking for methods to adapt your layout to small devices, I would have a look into media queries (about.com is a fairly well known site with a good example of this kind of responsive layout ).
Here are some relevant links
To whip IE into compliant shape, you’ll need to turn to Javascript, but there are a lot of shim solutions – like this one: http://code.google.com/p/css3-mediaqueries-js/