Hey guys, I am working on a personal portfolio and so far it is going alright but I have a question to make it look a little better. I am embedding some of my slideshare presentations and they include an iframe what has a defined width="597" height="486"
Well, I am trying to make my site resize based on browser sizes so it works well with mobile devices. I've got all that figured out, but if i change the width of the slide presentation to 100% to take up the entire DIV, It works well in adjusting the width to fit the browser, but the height remains at 486.
Although the slide content itself does adjust in response to the width, the surrounding frame that has the slide controls and all does not, so it leaves large gray areas above and below the slideshow.
Is there a way to have the box adjust as well so it keeps the aspect ratio of the slide content?
Here is the embed code if it helps. I colored the text I am changing.
<iframe src="http://www.slideshare.net/slideshow/embed_code/5734158" width="597" height="486" frameborder="0" marginwidth="0" marginheight="0" scrolling="no" style="border:1px solid #CCC;border-width:1px 1px 0;margin-bottom:5px" allowfullscreen webkitallowfullscreen mozallowfullscreen> </iframe> <div style="margin-bottom:5px"> <strong> <a href="http://www.slideshare.net/jcc5018/wide-open-spaces-5734158" title="Wide Open Spaces" target="_blank">Wide Open Spaces</a> </strong> from <strong><a href="http://www.slideshare.net/jcc5018" target="_blank">Jon </a></strong> </div>