Scene: In a fixed-height div, there is a floating element that needs to be centered vertically on the floating element.
The original code is as follows:
The code is as follows:Now it's just simple to set this button to float, and the effect of the implementation looks like this:
Now you need to center the button vertically across the div. My approach is to add a span to the button's outer layer and float the span element instead of the previous button. It is also necessary to set the height and row height of this span to be the same as the outer Div.
代码如下:
span{
float: right;
height: 300px;
line-height: 300px;
}
This should be the case now:
Complete code:
The code is as follows:Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
