**So I'm trying to create the following illustrated layout with images.. I need:**  

 - Two stacked images on the right to be the same height as the left   

 - Width to not go off the page  

 - Entire container to be centered   

 - Divs to be dynamic   

[![Image Layout](https://i.stack.imgur.com/D9aVR.png)](https://i.stack.imgur.com/D9aVR.png)

At the moment I have not been successful..

**Code so far:**  

Style:

```
 #menucontainer{position:absolute; display:block; width:100%; margin-top:5%;  margin-left:0 auto; text-align:center }
    #menucontainer div{display:inline-block; vertical-align:top; padding:0 !important}
    #highscore, #howto{display:inline-block; ;}
    #highscore img, #howto img{width:100%; -moz-box-shadow: 0 0 5px #888;
    -webkit-box-shadow: 0 0 5px#888;
    box-shadow: 0 0 5px #888}
    #play{width:100%;  -moz-box-shadow: 0 0 5px #888;
    -webkit-box-shadow: 0 0 5px#888;
    box-shadow: 0 0 5px #888}
    #left{width:50%; }
    #right{margin-left:1%; width:40%;}
    #highscore{margin-top:3.5%}
    #centerit{margin:0 auto;}

```

HTML:

```
  <div id="menucontainer">
  <div id="centerit">
    <div id="left">
        <img src="pics/play.png" id="play"/>
    </div>

    <div id="right">
       <div id="howto"><img src="pics/howto.png" /></div>
       <div id="highscore"><img src="pics/scores.png" /></div>
    </div>
</div>

```