Question

I have three images inside a div that scale according to window size. The div has a width of 60% and is floated left

<div id="display">
<img src="assets/images/angle1.jpg" style="width:35%;height:35%;" />
<img src="assets/images/angle2.jpg" style="width:35%;height:35;" />
<img src="assets/images/angle3.jpg" style="width:60%;height:100%;" />
</div>

Basically I want to maintain this scalability with the images arranged like this:

IMG SETUP http://brycekirk.ca/assets/images/setup.gif

Answer 1

Use nested DIVs to keep the right-side images together:

<div id="display">
    <div id="column1" style="width:35%; float:left">
        <img src="assets/images/angle1.jpg" /><br/><img src="assets/images/angle2.jpg" />
    </div>
    <div id="column2" style="width:60%; float:left">
        <img src="assets/images/angle3.jpg" />
    </div>
</div>