bonjour,

J'ai un petit souci de centrage. J'ai un div qui comporte une image en background dans lequel j'ai deux autres div respectivement en float left et float right. Le premier des deux div intérieur comporte une photo et le second du texte (qui peut être sur deux lignes). Je souhaiterais pouvoir centrer verticalement ce div contenant le texte par rapport au div qui comporte l'image en background.

voici ma ccs

.ssMenu {
    background-image: url("../images/ss_menu_fond.jpg");
    background-repeat: no-repeat;
    height: 66px;
    width: 206px;
    padding-left: 5px;
}
.ssMenuPicto {
    height: 40px;
    width: 50px;
    border: solid 1px #FFFFFF;
    margin-top: 10px;
    float: left;
}
.ssMenuTitre a {
    height: 100%;
    vertical-align: middle;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 16px;
    font-weight: bold;
    color: #FFFFFF;
    text-decoration: none;
    margin-right: 20px;
    float: right;
    line-height: 16px;
}


et le html
<div class="ssMenu">
  <div class="ssMenuPicto"><img src="images/ss_menu_picto_parole.jpg" alt="Le d&eacute;bat" title="Le d&eacute;bat" /></div>
  <div class="ssMenuTitre"><a href="#">Parole de sport</a></div>
  <div class="clear"></div>
</div>


Comment faire pour les centrer verticalement puisque le vertical-align: middle; ne fonctionne pas ?
Merci.
Modifié par Taly (10 Apr 2006 - 16:00)
oui bien sûr Smiley smile mais je n'ai trouvé que des manières de centrer du texte dans un bloc, or moi je veux centrer un bloc dans un bloc.
j'ai bien vu ce lien (merci Smiley smile ) mais IE ne gère pas le table-cell...
En faite, ces tutos proposent de centrer un bloc mais pas ce qu'il y a dans ce bloc.
Modifié par Taly (10 Apr 2006 - 14:12)
Taly a écrit :
j'ai bien vu ce lien (merci Smiley smile ) mais IE ne gère pas le table-cell...
En faite, ces tutos proposent de centrer un bloc mais pas ce qu'il y a dans ce bloc.


Tu veux dire, centrer verticalement dans un bloc ...


la faq a écrit :

5- Dernière solution, si toutes les autres ne conviennent pas et si la compatibilité avec IE est nécessaire : utiliser une cellule de tableau sur laquelle vertical-align fonctionnera. Eh oui, nous ne sommes pas des intégristes non-plus !

Liens complémentaires

* http://forum.alsacreations.com/topic.php?fid=4&tid=35
* http://forum.alsacreations.com/topic.php?fid=4&tid=1366
* http://forum.alsacreations.com/topic.php?fid=4&tid=699

Modifié par Vero (10 Apr 2006 - 14:26)
Administrateur
Taly a écrit :
oui c'est bien ces liens que j''ai vu et ils ne permettent que de centrer du texte dans un bloc..

Hello,

Je crois qu'on a bien compris depuis le début Smiley smile

Bref, retourner voir le lien donné par Véro Smiley cligne
J'ai testé la méthode line-height qui fonctionne très bien mais comment faire lorsque le texte est sur deux lignes ? Smiley decu