Ok I can align a content both horizontally and vertically using this
<div id="centerId">...content</div>
#contentId {width: 300px; height: 200px; position: absolute; left: 50%; margin-left: -150px; top: 50%; margin-top: -100px; }
Now how to align if I want width to be 90% of the container in which #contentId is.
I usually use two ensted divs as follows...
<div style="display: block; height: 100%; width: 100%; position:relative; overflow: hidden;margin: 0px auto;">
<div style="position: absolute; top: 40%;left:0px;display: table-cell; vertical-align: middle;text-align:center;">
Content Here...
</div>
</div>
The trick here is the
display: table-cell
Give it a try:D
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.