hosted by liquidweb

Go Back   Web Hosting Talk : Web Hosting Main Forums : Web Hosting Talk Tutorials : Web Design and Content Tutorials : How To Center Text Vertically with CSS

Forum Jump

How To Center Text Vertically with CSS

Reply Post New Thread In Web Design and Content Tutorials Subscription
Send news tip View All Posts Thread Tools Search this Thread Display Modes
rogue element
Join Date: Jun 2004
Location: Northwest Colorado
Posts: 4,630

How To Center Vertically with CSS

Unfrozen Caveman Webmaster here with a tip!

When I designed with table-based layout, I designed many layouts with blocks of text vertically centered in a table cell. Piece of cake! Unfortunately, css doesn't seem to provide an easy alternative, although I'm very new to table-free css layout. I have come across two methods (hacks, whatever).

To vertically center a single line, set its line-height to the height of the element you are centering it in.

For blocks of content, today I stumbled across the following solution, which is so elegant and well-presented I thought I'd share it here:

Sponsored Links
New Member
Join Date: Nov 2004
Location: Detroit
Posts: 2
thats a good hack, thanks for sharing

Join Date: Jun 2003
Posts: 3
Thanks for sharing. But I don't really understand

Sponsored Links
learning is in the doing
Join Date: Sep 2000
Location: Alberta, Canada
Posts: 3,109
The caring is in the sharing.  The learning is in the doing.  

__________________ - for all your Hosting needs
Helping people Host, Create and Maintain their Web Site
ServerAdmin Services also available

Web Hosting Master
Join Date: Jun 2004
Location: Bay Area -USA
Posts: 1,738
Thanks! I've been looking for something like this!

<<< Please see Forum Guidelines for signature setup. >>>

Join Date: Feb 2005
Posts: 6
Thanks for sharing! I've always wondered how to do this

Junior Guru Wannabe
Join Date: Dec 2004
Location: North Shore
Posts: 95
Nice tip. Thanks for sharing


Web Hosting Master
Join Date: Dec 2003
Location: ./Southest Missouri
Posts: 601
I bet I've gone through 4 can's of Mt. Dew messing with that, trying to get it to work before coming across this article... now I'm too wired to sleep... might as well go do some more work! Thanks.

Temporarily Suspended
Join Date: Jan 2005
Location: Derby, UK
Posts: 15
Cheers dude. I use this on my domain name registration 'please wait' page.

Join Date: Feb 2005
Posts: 17
Nice one


Web Hosting Master
Join Date: Mar 2004
Posts: 996
Good hack. Thanks BigBison!

New Member
Join Date: Apr 2005
Posts: 3
yeah thanks for sharing

Join Date: Dec 2005
Posts: 6
Wow nice hack, I've been looking for something like this for a loong time. thnx a bunch

Join Date: Dec 2005
Location: New York City
Posts: 4
pretty cool

i used to just have like a bottom or top margin until its centered


Related posts from
Title Type Date Posted
IBM SoftLayer Extends its Cloud to Hong Kong Web Hosting News 2014-03-27 10:10:48
Photos from ResellerClub Hosting Summit 2013 Blog 2013-10-22 04:01:51
CyrusOne to Build Second Data Center in San Antonio Web Hosting News 2013-08-08 14:40:08
Third Party Data Center Provider Budgets See Growth: Uptime Institute Survey Web Hosting News 2013-08-08 12:31:45
ProfitBricks Infographic: Web Hosting from 1995 to Today Blog 2013-06-28 13:52:35

Thread Tools Search this Thread
Search this Thread:

Advanced Search
Display Modes
Postbit Selector

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is Off
HTML code is Off

Forum Jump
Log in with your username and password

Forgot Password?
WHT Host Brief Email:

We respect your privacy. We will never sell, rent, or give away your address to any outside party, ever.

Web Hosting News:
WHT Membership
WHT Membership



Welcome to

Create your username to jump into the discussion! is the largest, most influentual web hosting community on the Internet. Join us by filling in the form below.

(4 digit year)

Already a member?