Centrage verticale ok sous IE mais pas sous Opéra FireFox

Bonjour,

J'ai un problème pour centrer un texte entre balise <h1></h1>dans un div positionné au centre d'une page, cela se présente ainsi :

code page

<div class="site"><!-- conteneur -->
<div class="colCG"><!-- col centre gauche -->
			<img class="imgGH" src="images/vN.jpg" width="168" height="26" alt="VN" title="VN"  />
			<img class="imgGB" src="images/ma.jpg" width="168" height="134" alt="">
			<h3 class="titrevn01">TEXTE</h3>
			<p class="titrevn04">TexteA : <br>  TexteB </p>
			<iframe class="mender" name="moteur" src="../pg_vh.asp" width="168" height="90" scrolling="no" border=0 frameborder=0> </iframe>
		</div><!--Fin col centre gauche -->
		<div class="colCD"><!-- col centre droite -->
		<h1 class="titre02">TEXTE_BLABLABLA</h1>
		</div><!--Fin col centre droite -->
	</div><!--Fin col centre -->
</div>

Mon script css :

/*  ------------------------------------------
/*  Colonne Centre
/*  ------------------------------------------
*/

.colCentre {
	float:left;
	width: 558px;
	height: 308px;
	margin-left: 14px;
	border: 1px solid;
	border-color: #2F406C;
	margin-top: 2px;
}

.colCG {
	float: left;
	width: 168px;
	height: 308px;
	border-right: 1px solid #2F406C;
	background-color: #FFFFFF;
}

.imgGH {
	display: block;
	width: 168px;
	height: 26px;
}

.imgGB {
	display: block;
	width: 168px;
	height: 134px;
}

.titrevn01 
{ 
	font-family: Verdana, Arial, Helvetica, sans-serif; 
	font-size: 11px;
	color: #2F406C; 
	text-align: center; 
	font-weight: bold; 
	text-decoration: none;
	margin: 0;
}

.titrevn04 {
	font-family: Verdana, Arial, Helvetica, sans-serif; 
	font-size: 9px; 
	color: #2F406C; 
	text-align: center; 
	font-weight: none; 
	text-decoration: none; 
}

.mender {
	width: 168px;
	height: 90px;
	margin-top: 7px;
}

.colCD {
	float: right;
	width: 389px;
	height: 26px;
	line-height: 26px;
	background-color: #2F406C;
	text-align: center;
}

.titre02 {
	font-family: Geneva, Arial, Helvetica, sans-serif;
	font-size: 12px/;/
	color: #FFFFFF;
	font-weight: bold;
	text-decoration: none;
	letter-spacing: 2px;
}

Sous IE 7 le texte est bien centré verticalement, mais sous FireFox et Opéra, le texte n'est pas centré. J'utilise pour centrer line-heigth : avec le même valeur que celle de la hauter du div qui contient ce texte.
J'ai essayé la méthode proposée >>ICI<<
le résultat est idem, là je ne vois pas pourquoi cela ne fonctionne pas car j'utilise line-heigth: dans un autre div et cela fonctionne bien et ce div est le frère de celui qui m'embête donc ils sont le même père et donc je ne vois pas pourquoi cela ne fonctionne pas !!

Merci pour votre aide !!

Salut.

Désolé, mais je n'ai pas compris ce que tu essaies de faire

Quel texte doit être centré, dans quel sens et par rapport à quoi ?

le texte

<h1 class="titre02">TEXTE_BLABLABLA</h1>

qui est dans le div

<div class="colCD"><!-- col centre droite -->

		<h1 class="titre02">TEXTE_BLABLABLA</h1>

		</div><!--Fin col centre droite -->

Il doit être centré verticalement c'est ce qui pose prb sur Firefox et Opéra mais OK sous IE 7, j'arrive bien à le centrer horizontalement.

@+
Modifié par Gobelin (11 Jan 2007 - 17:03)

Ok, comme ça je comprends

Et ça ne marche pas avec

.colCD {
   height: 26px ;
   ...
}

et

.titre02 {
   line-height: 26px ;
   ...
}

?

Par ailleurs, préciser les hauteurs de tes éléments en pixels de la sorte n'est pas recommandé, ça complique l'agrandissement de la police de caractères. Et, les tableaux de mise en forme, c'est mal!