Centralizar imagem em div

[formigoni 0]

Olá, boa tarde a todos.

Sei que o tópico pode parecer simples, mas já pesquisei e refiz vários testes muitas vezes e não consegui, por isso venho pedir um auxílio.

Preciso centralizar uma imagem dentro de uma div, vejam o que tenho:

 

A imagem que preciso centralizar está nessa <div class="set">, vejam ela completa:

 

<div id="carouseldiv" style="background-color:#FFFFFF"; >
 <?php do { ?>
   <div class="set">
   	<img src="../colecao/<?php echo $row_colecaofotos['imagem']; ?>" alt="" />
   </div>
   <?php } while ($row_colecaofotos = mysql_fetch_assoc($colecaofotos)); ?>
</div>

 

O script que tem ligação com a div, aqui é definido altura e largura, pois esse scrip é um carrossel de imagens:

 

<script type="text/javascript">
$(document).ready(function() {	
try {
	var oHandlerHorizontal = $("#carouseldiv").msCarousel({boxClass:'div.set', width:375, height:550, scrollSpeed:500}).data("msCarousel");
	$("#next").click(function() {
		oHandlerHorizontal.next();
	});
	$("#previous").click(function() {
		oHandlerHorizontal.previous();
	});	

} catch(e) {
	alert(e.message);
}

})
 </script>

 

O css:

 

.mscarousel {overflow:hidden}
.mscarousel img{border:0}
.mscarousel .child{position:relative;}
.mscarousel .child .set, .mscarousel .set{float:left; position:relative;}
.mscarousel .child .set .message, .mscarousel .set .message{/*position:absolute; top:0; left:0; background-color:#333333; color:#fff; display:none;*/}
.mscarousel .child .clear{clear:both}
.hand{cursor:pointer}

 

Não consegui de forma alguma fazer isso e se puderem me ajudar, vou agradecer muito.

Valeu e fiquem na paz.

[Evandro Oliveira 331]

tenta isso aqui:

.set { display: block; line-height: 550px; text-align: center; vertical-align: middle; }

[formigoni 0]

Olá, bom dia a todos.

Ao Evandro, obrigado por ter respondido.

 

Fiz a alteração que você me indicou, mas no visual aqui no dreamweaver a imagem ficou centralizada mas nos navegadores não.

Será que fiz alguma besteira?

o CSS alterado ficou assim:

 

.mscarousel {overflow:hidden}
/*.mscarousel img{border:0}*/
.mscarousel .child{position:relative;}
.set { display: block; line-height: 550px; text-align: center; vertical-align: middle; }
.mscarousel .child .set, .mscarousel .set{float:left; position:relative;}
.mscarousel .child .set .message, .mscarousel .set .message{/*position:absolute; top:0; left:0; background-color:#333333; color:#fff;  display:none;*/}
.mscarousel .child .clear{clear:both}
.hand{cursor:pointer}

 

Valeu e fiquem na paz.

[Evandro Oliveira 331]

Mude a nova linha uma linha para baixo. Ela deverá ficar embaixo de

.mscarousel .child .set, .mscarousel .set{float:left; position:relative;}

 

Esqueça a parte visual do Dreamweaver. Ninguém navega na internet utilizando Dreamweaver. ;)

 

Adicione, também, em .set a propriedade abaixo

width: 375px;

[fonor 0]

Olá amigo, pelo que eu vi neste texto ensinando a como centralizar uma div, basta você fazer o seguinte:

 

.mscarousel {overflow:hidden}
/*.mscarousel img{border:0}*/
.mscarousel .child{position:relative;}
.set { display: block; line-height: 550px; text-align: center; vertical-align: middle; }
.mscarousel .child .set, .mscarousel .set{float:left; text-align: center position:relative;}
.mscarousel .child .set .message, .mscarousel .set .message{/*position:absolute; top:0; left:0; background-color:#333333; color:#fff;  display:none;*/}
.mscarousel .child .clear{clear:both}
.hand{cursor:pointer}

 

 

Espero que tenha te ajudado. qualquer dúvida só postar no fórum