#one { position:relative; background-color:blue; height:350px; width:350px; } .two { background-color:orange; height:125px; width:125px; position:relative; top: 50%; transform: translateY(-50%); margin: 0 auto; }
On Wed, Jun 3, 2015 at 8:00 PM, Tom Livingston <tom...@gmail.com> wrote: > It's: > > top:50%; transform: translateY(-50%) > > On Wed, Jun 3, 2015 at 7:46 PM, Crest Christopher > <crestchristop...@gmail.com> wrote: >> I've come across many pages how to center a item horizontally and >> vertically, one method {margin: 0 auto;} works great, horizontally, not >> vertically. I found another solution whereas, all I do is add >> {top:50%;translateY(-50%);} to the child, that is not working either ? >> >> [Example <https://jsfiddle.net/WildWind/bs84tegs/>] >> ______________________________________________________________________ >> css-discuss [css-d@lists.css-discuss.org] >> http://www.css-discuss.org/mailman/listinfo/css-d >> List wiki/FAQ -- http://css-discuss.incutio.com/ >> List policies -- http://css-discuss.org/policies.html >> Supported by evolt.org -- http://www.evolt.org/help_support_evolt/ > > > > -- > > Tom Livingston | Senior Front End Developer | Media Logic | > ph: 518.456.3015x231 | fx: 518.456.4279 | medialogic.com > > > #663399 -- Tom Livingston | Senior Front End Developer | Media Logic | ph: 518.456.3015x231 | fx: 518.456.4279 | medialogic.com #663399 ______________________________________________________________________ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/