CSS: center element vertically
Suppose we have a container with a child div in it, and we want to center the div vertically in the container, and it should be centered in the container even if the width of the contain is changed. For example, here is the html div:
<div id="container"> <div id="child">vertically centered</div> </div>
Here is the css for the above div to center the child element vertically.
#container{ background:green; width:200px; height:300px; } #child{ background: red; height: 100px; position: relative; top: 50%; transform: translateY(-50%); }
vertically centered
Search within Codexpedia
Custom Search
Search the entire web
Custom Search
Related Posts