Vertical Center text in a div

[eetec]

I am trying vertical center my text in a div but it always float at top in div. I also tried using a span inside the div and apply css on span but it too not works. I used this css property (vertical-align:middle)

This is Html

<div id="topsmallmenucontainer">
<div class="topmenuleft"></div>
<div class="topmenumiddle"><span> Thhis is text inside div</span></div>
<div class="topmenuright"></div>
<div class="clearBox"></div>
</div>

This is CSS

#topsmallmenucontainer
{
	width:406px;
	height:41px;
	position:absolute;
	top:53px;
	right:30px;
}
.topmenuleft 
{
	width:7px;
	height:41px;
	float:left;
	position:relative;
	background-image: url(../images/top_small_menu_left.png);
	background-repeat: no-repeat;
	background-position: 0 0;
}
.topmenumiddle 
{
	width:393px;
	height:41px;
	position:relative;
	float:left;
	background-image: url(../images/top_small_menu_middle.png);
	background-repeat: repeat-x;
	background-position: 0 0;
	vertical-align:middle;
	color:#FFF;
}

.topmenuright 
{
	width:6px;
	height:41px;
	position:relative;
	float:left;
	background-image: url(../images/top_small_menu_right.png);
	background-repeat: no-repeat;
	background-position: 0 0;
}
.clearBox
{
	clear:both;	
}

This is output div snap

[Excavator]

Hello eetec,
A single line of text is easy to vertically centered with line-height, like this -

.topmenumiddle {
	width: 393px;
	line-height: 41px;
	float: left;
	position: relative;
	/*vertical-align: middle;*/
	color: #fff;
	background: url(../images/top_small_menu_middle.png) repeat-x 0 0;
}

vertical-align
line-height

It gets more complicated if you want to center a paragraph or div element. See some vertical center examples here.
My favorite is the last one which uses a float and a clear.

[eetec]

Excavator,

This answer is very helpful for me.
Thank You.