Does any css expert know how to center text of various lengths (database pulled) vertically inside a div that had dynamic height (could be any and I need text to be displayed in vertical center). Basically I'm looking for a CSS way to achieve valign=center. Can anyone help?
Short answer: nope. Longer answer-- Paul O'Brien has made the best try at this, using CSS alone. it requires at least an extra container. http://www.pmob.co.uk/temp/vertical-align11.htm Or, there are other vertical-aligns in just the /temp folder, but most of them are just vertical-align: which is a CSS property for inline elements, not blocks. It's still difficult to do within a page full of other stuff. CSS kinda sucks with vertical alignment. Some people decide to go ahead and use an HTML table. If this is for an intranet which doesn't use Internet Explorer, you can stay with CSS and use display: table where you get the alignment benefits of an HTML table. However, IE6 and 7 do not support display: table. IE8 I think will.
Thanks a lot for you input. Unfortunately, this is for a social network with 200 000 uniques a month and 70% use Internet Explorer so solution that doesn't work in IE would have me lose a lot of traffic. I was surprised when I wasn't able to find the way to vertically align content of my divs but believed there would be a way. I just didn't know about it. Sadly, the more I look into it, the more it seems like I won't be able to center my text
Well, like I said, you can, IF you don't mind having extra HTML elements (and, apparenlty there are some other better Paul examples... look through the stuff on the main page of his site first) or You could throw it all into a table. A simple, "wrapper" table. Everything that's the generated content gets thrown into a single td (always a bad sign with tables, but this is what you may have to put up with) and vertical-align: middle just like with the inline stuff. It just depends on how much garbage code you want... if the sitting-in-the-center thing is really really important, you'll do it, and maybe go back later when everyone is using IE8 or better browsers and lean the code back down.