[thelist] aligning text to an arbitary height against an image

Tue Apr 6 12:47:43 CDT 2004

David Dorward wrote:

>On Tue, 2004-04-06 at 17:58, alex beston wrote:
>  
>
>>When i put text next to an image, it usually ends up at the bottom right 
>>of image. I want it to go exactly half way down. (or any position i define)
>>
>>how do i do this? ive tried vertical-align: middle in the stylesheet but 
>>with no joy.
>>    
>>
>
>As usual a URI makes it much easier to help. vertical-align: middle
>should work. Are you applying it to the image?
>  
>
thanks for your reply

heres some code:

#menu ul {

 padding:0;
 text-align:left;
 vertical-align: middle; 
}

#menu ul li{
height: 50px;
 list-style:none;
 margin: 5px;
border-style: dashed;
border-width: 1px;
border-color: blue;}

#menu ul li img{
float:left;
width:47px;
height: 40px;
}

#menu ul li a{
 text-decoration: none;
 top:0px;
}

#menu ul li a:hover{
text-decoration: underline;
}

.leftPane{
width: 170px;
background-color: white;
}

-->
</style>
</head>
<body > <div align="center">

  <div id="welcomeBanner"><h1><span>competition</span></h1></div>

  <table width="700" border="0" cellspacing="0" cellpadding="0">
    <tr>
      <td class="leftPane">
      <div id="menu">
<ul>
<li><img src="images/green_quaver.jpg" /><a href="#">Home</a></li>

<li> <img src="images/purple_quaver.jpg" /><a href="#">MailBag</a></li>
</ul>

      </div>

etc

cheers,
Alex