Center a div vertically?

Question

I'm building a responsive website, and I have a div (named 'wrapper'), that I want to be in the center of the page at all times. I figured out how to center it horizontally, because I have a set width percentage. How would I center this vertically, if I DONT have a set height percentage?

.wrapper{
    width: 50%;
    height: auto;
    margin-left: 25%;
    padding: 3%;
}'

Duplicate of [What's the best way of centering a div vertically with CSS?](http://stackoverflow.com/q/396145/254830) — doppelgreener, Sep 06 '13 at 00:43

score 2 · Answer 1 · answered Apr 16 '13 at 19:46

2

Try this tutorial
Centering div vertically and horizontally

http://www.jakpsatweb.cz/css/css-vertical-center-solution.html

answered Apr 16 '13 at 19:46

Navnath Godse

2,233
2
23
32

This answer would be better if it summarized the technique described in the article, rather than linking off-site. – KatieK Jun 28 '13 at 16:57

score 1 · Answer 2 · answered Apr 18 '13 at 15:53

1

Try this jQuery plugin: TailorFit and check out the demo.

One way you could use it would be like this:

$('#your-div').tailorfit();

Because your height is auto, that alone should do the trick.

Full disclosure - I'm the author of the plugin.

answered Apr 18 '13 at 15:53

rtheunissen

7,347
5
34
65

Center a div vertically?

2 Answers2