Help Vertially Centering a Span within a Div

I'm building an hmtl form and trying deperately not to go back to
table positioning... I have a series of checkboxes on the right and
the label on the left. I want the label on the left to be vertically
centered with the checkboxes on the right. I can't seem to find a way
to do this. I dont want to use pixel positioning because the number of
checkboxes on the right will change dynamically. Any ideas? My code is
posted below... If there's an easier to way to accomplish the look I'm
after please let me know.. thanks!


<style type="text/css">
..NSDFormDiv
{
border-style: solid;
border-color: #D8D8D8;
border-width: 1px 0 0 0;
width: 600;
background-color: blue;
}
..NSDFormLbl
{
width: 200;
font-family: Verdana;
font-size: 11;
font-weight: bold;
color: #525252;
background-color: red;
}
..NSDFormBackground
{
background-color: #EBF3FF;
width: 400;
padding: 3 5 3 5;
}
</style>

<div class="NSDFormDiv">

<span class="NSDFormLbl">Center Me Vertically</span><span
class="NSDFormBackground">

<input type="checkbox" /><label>Business Objects (Reporting
application)</label>
<div></div>
<input type="checkbox" /><label>MIPS (Mill Production System)</label>
<div></div>
<input type="checkbox" /><label>Great Plains (Accounting & HR
application)</label>
<div></div>
<input type="checkbox" /><label>Microsoft Project</label>
<div></div>
<input type="checkbox" /><label>IFS (Purchasing system)</label>
<div></div>
<input type="checkbox" /><label>VPN</label>

</span>
</div>

On 29 Nov, 16:03, "~john" <SonVolt... (AT) gmail (DOT) com> wrote:

I'm building an hmtl form and trying deperately not to go back to
table positioning... I have a series of checkboxes on the right and
the label on the left. I want the label on the left to be vertically
centered with the checkboxes on the right. I can't seem to find a way
to do this. I dont want to use pixel positioning because the number of
checkboxes on the right will change dynamically. Any ideas? My code is
posted below... If there's an easier to way to accomplish the look I'm
after please let me know.. thanks!

style type="text/css"
.NSDFormDiv
{
border-style: solid;
border-color: #D8D8D8;
border-width: 1px 0 0 0;
width: 600;
background-color: blue;}

.NSDFormLbl
{
width: 200;
font-family: Verdana;
font-size: 11;
font-weight: bold;
color: #525252;
background-color: red;}

.NSDFormBackground
{
background-color: #EBF3FF;
width: 400;
padding: 3 5 3 5;}

/style

div class="NSDFormDiv"

span class="NSDFormLbl">Center Me Vertically</span><span
class="NSDFormBackground"

input type="checkbox" /><label>Business Objects (Reporting
application)</label
div></div
input type="checkbox" /><label>MIPS (Mill Production System)</label
div></div
input type="checkbox" /><label>Great Plains (Accounting & HR
application)</label
div></div
input type="checkbox" /><label>Microsoft Project</label
div></div
input type="checkbox" /><label>IFS (Purchasing system)</label
div></div
input type="checkbox" /><label>VPN</label

/span
/div

You can center inline elements vertically with vertical-align:middle
and line-height set to 100% of the containing element.

Tor