CODEWITHSUNDEEP
htmlcss
19wolf
19wolf

Reputation: 402

Align from middle of div

I'm fairly certain this is not your typical "vertical align center" question... What I'd like to do is take a div of unknown height and position it a certain percentage down the page (say 33%). I have been able to achieve this, but not how I'd like to.

Instead of postion:absolute; top: 33% or bottom:33%; I'd like to specify the 33% to be calculated from the middle of the div of unknown height. Is this possible?

Upvotes: 1

Views: 50

Answers (1)

Lokesh Suthar
Lokesh Suthar

Reputation: 3202

Yes it is possible.

.your_div{
  position:absolute;
  top:33%;
  -webkit-transform:translateY(-50%);
  transform:translateY(-50%);
}

In this codepen, checkout 1st div. I have aligned it in the middle by using top:50% you can set it to any percentage.

Upvotes: 3

Related Questions