Esempio dal vivo QUI
Codice:
codice:
<style type="text/css">
#main{margin:0 auto;
border:1px solid black;
width:1020px;
}
#img{position:relative;
margin-top:30px;
width:960px;
height:500px;
border-radius:20px;
border:1px solid red;
margin-left: 30px;
z-index:10;}
#bt_top{margin-top:-20px;
margin-left:30px;
position:relative;
width:900px;
height: 80px;
border:2px solid green;
z-index:15;}
.bt_top{width:200px;
height:70px;
margin-top: 5px;
margin-left:70px;
float:left;
background:orange;
border-radius:8px;}
#bt_bottom{margin:10px auto;
position:relative;
width:900px;
height: 80px;
border:2px solid green;
z-index:17;}
.bt_bottom{width:200px;
height:70px;
margin-top: 5px;
margin-left:70px;
float:left;
background:green;
border-radius:8px;}
</style>
</head>
<body>
<div id="main">
<div id="img">
<div id="bt_top">
<div class="bt_top"></div>
<div class="bt_top"></div>
<div class="bt_top"></div>
</div>
</div>
<div id="bt_bottom">
<div class="bt_bottom"></div>
<div class="bt_bottom"></div>
<div class="bt_bottom"></div>
</div>
</div>
</body>
</html>
Ovviamente va modificato e migliorato, ma è uno dei 100 possibili modi per fare ciò che chiedi.
I bordi verdi dei contenitori dove ci sono i bottoni li ho fatto solo per farti capire meglio.