div con immagini problema footer opera e firefox

[gabar-el]

ciao, ho un div contenitore e all'interno 2 div con classe unico (che si estendono uno sotto l'altro), avendo delle immagini nel primo il tutto si complica, cmq ho risolto con clear: both. In ie vedo tutto bene, mentre in opera e ff il piede mi sta in mezzo al secondo div, perchè? come risolvo nel css per far si che anche opera e ff visualizzino come vorrei il layout?

html, body {
	margin: 0;
	padding: 0;
	height: 100%;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 14px;
	text-align: center;
}
#contenitore {
	margin: 0 auto;
	padding-bottom: 50px;
	width: 780px;
	height: 100%;
	position: relative;
}
body>#contenitore {
	margin: 0 auto;
	padding-bottom: 50px;
	width: 780px;
	height: auto;
	min-height: 100%;
}
.unico {
	margin-top: 25px;
	width: 780px;
	text-align: center;
	clear: both;
}
.unico img {
	margin: 3px;
	border: 1px solid #000;
	left: auto;
	float: left;
}
#piede {
	width: 100%;
	margin: 0;
	padding-left: 5px;
	position: absolute;
	bottom: 0;
	left: 0;
	font-size: 10px;
	text-align: left;
	background-color: #e6e6e6;
}

html:

<div id="contenitore">
  <div class="unico">
		<h1></h1>
        

</p>
<img/>
<img/>
<img/>
<img/>
<img/>
<img/>
<img/>
<img/>
<img/>
<img/>
	</div>
	<div class="unico">
<h1></h1>
		[img][/img]
	</div>
	<div id="piede">
	</div>
</div>

[gabar-el]

ho messo le immagini in una lista in modo che non vadano una sotto l'altra ma si affianchino, ma ho ancora grossi problemi. il footer non ne vuol sapere di mettersi sotto, sono stremato!!!
al momento il codice css è questo:

html, body {
	margin: 0;
	padding: 0;
	height: 100%;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 14px;
	text-align: center;
}
#contenitore {
	margin: 0 auto;
	padding-bottom: 50px;
	width: 780px;
	height: 100%;
	position: relative;
}
body>#contenitore {
	margin: 0 auto;
	padding-bottom: 50px;
	width: 780px;
	height: auto;
	min-height: 100%;
}
.unico {
	margin-top: 25px;
	width: 780px;
	text-align: center;
	clear: both;
}
.unico ul {
	margin: 0;
	padding: 0;
	list-style-type: none;
}
.unico ul li {
	float: left;
}
.unico ul li img {
	margin: 3px;
	border: 1px solid #000;
}
#piede {
	width: 100%;
	margin: 0;
	padding-left: 5px;
	position: absolute;
	bottom: 0;
	left: 0;
	font-size: 10px;
	text-align: left;
	background-color: #e6e6e6;
}

questo l'html:

<div id="contenitore">
  <div class="unico">
        

</p>
<ul>[*][*][*][/list]
<ul>[*][/list]
</div>
	<div id="piede">
	</div>
</div>

sono veramente alla canna! devono essere le troppe ore davanti al pc, magari è una cavolata e non la vedo per stanchezza!!! grazie