Aligning images inside divs

Question

I'm trying to fit three images inside a div, but I'm having trouble getting them to align properly. This is what I have in mind:

But I can't for the life of me figure this one out. Can anyone please lend a hand? Thanks!

Answer 1

If changing markup is allowed, I propose to wrap img 1 and 2 in another div - then it is just a matter of floating the div to the left.

Answer 2

http://jsfiddle.net/tMxkX/2/

Answer 3

CSS

div#container {
    width:400px;
    height: 400px;
    padding:50px;
    background: red;
}
div.leftbox {
    float: left;
    width:175px;
    height: 175px;
    margin-bottom: 50px;
    background: blue;
}
div.rightbox {
    float: right;
    width: 175px;
    height: 400px;
    background: yellow;
}

HTML

<div id="container">
    <div class="rightbox">
        Right Image Box
    </div>
    <div class="leftbox">
        Left Image Box Top
    </div>
    <div class="leftbox">
        Left Image Box Bottom
    </div>
</div>

Answer 4

Can you post the html and css?