Vertically Align Span Inside Right Floated Div

Hi there,

I have a DIV that is 40px high and 100% wide.
Inside that DIV I have a DIV that is floated to the right.
Inside the floated DIV I have a SPAN (generated by ASP.NET) with text in it.

I need to have the SPAN vertically aligned inside the floated DIV.

For the life of me, I cannot figure out how to do it. I really need an experts help!

Thanks!
LVL 6
hehdaddyAsked:
Who is Participating?
 
Blind-SummitConnect With a Mentor Commented:
Ignore that, just set the span line-height to 40px.


span {
   line-height: 40px;
}
0
 
hehdaddyAuthor Commented:
I forgot to mention that I am using IE7/8.
0
 
Sebastian TalmonSystem Engineer Datacenter SolutionsCommented:

Do you need to align only the <span> (is there other text that should not get aligned), or is it ok if you get anything in your floated <div> aligned?

if only the <span> should be aligned, you have to make it a block element (<span> is normally an inline-element) before you could align the text in it:
span.xxxx { display:block; width:100%; text-align:center; }

if you could use the floated div, try something like
div.xxxx  { text-align:center; }
0
Keep up with what's happening at Experts Exchange!

Sign up to receive Decoded, a new monthly digest with product updates, feature release info, continuing education opportunities, and more.

 
hehdaddyAuthor Commented:
@tacotec - I need to align the SPAN vertically (up and down). Does your solution do that?
0
 
Sebastian TalmonSystem Engineer Datacenter SolutionsCommented:

args - vertically (sorry, my mistake)

is the span the only content in the div?

could you maybe give some short sample of the html-code?
0
 
Blind-SummitCommented:
div {
height:40px;
}
div div {
height:40px;
}
div div * {
vertical-align:middle;
}
div div span {
display:block;
}
0
All Courses

From novice to tech pro — start learning today.