Center in translate, center in css3translate
<! Doctype html>
<Html>
<Head>
<Meta charset = "UTF-8">
<Meta name = "Author" content = "Hu Chao">
<Title> super Hu </title>
<Style type = "text/css">
Html, body, div {margin: 0; padding: 0}/*, insert a div outside the content Element
And set the div height: 50%; margin-bottom:-(contentheight + padding)/2 ;.
For example, if the content height is 100px and the total padding is 20px, margin-bottom:-60px will squeeze the content down.
The disadvantage is to add meaningless labels, but the advantage is that IE6 is simple and compatible */
. Box {
Margin: 20px auto;
Width: 200px;
Height: 600px;
Background: black;
}
. Floater {
Height: 50%;
Margin-bottom:-50px;
}
. Content {
Margin: 0 auto;
Padding: 10px;
Width: 100px;
Height: 100px;
Border: 2px solid # adf;
Background: # abc;
}
</Style>
</Head>
<Body>
<Div class = "box">
<Div class = "floater"> </div>
<Div class = "content"> </div>
</Div>
</Body>
</Html>