Hi I’m trying vertically align a header using the transform method
position:relative;
top:50%;
transform:translate(-50%);
but for some reason it isn’t working?
Remove the height:100%.
You don’t really want to use that method unless you are in a controlled space as there are better ways now to centre using flex or other methods (moving stuff with position:relative is fraught with danger if you don’t fully understand what it does).
2 Likes
Would you recommend using if I’m using for a hero image and have set the height to 100vh?
I’d do it like this as it will work right back to IE8 (although I only support IE11+ these days ;)).
1 Like
This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.