<% @ Page Language = "C #" AutoEventWireup = "true" CodeFile = "div absolute play. aspx. cs" Inherits = "div absolute play" %>
<! DOCTYPE html PUBLIC "-// W3C // dtd xhtml 1.0 Transitional // EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<Html xmlns = "http://www.w3.org/1999/xhtml">
<Head runat = "server">
<Title> div is absolutely centered </title>
<Style type = "text/css">
/* In the middle-level CSS, locate a point in the center of the page */
# Center
{
Background: # ffffff;
Height: 400px;
Width: 300px;
/* Set the location */
Top: 50%;
Left: 50%;
Position: absolute;
Color: # ffcccc;
}
/* Content layer CSS, which determines its position based on the central point */
# Content
{
Background: red;
Width: 300px;
Height: 200px;
/* Set float, out of the middle-level limit (menu is useful )*/
Position: absolute;
/* Top-Right Bottom left margin. The two values are set here. The first value is the height, and the second value is the width, but both are the width and height of the DIV */
Margin:-100px 0 0-150px;
/* Demo */
Color: #111111;
}
/* The above two documents are displayed at http://www.cccbbs.net/htm_data/36/0811/28798.html. a fixed revision is made */
/* For the merge of the above two, you only need to call this CLASS */
# Test_center
{
Width: 340px;
Height: 140px;
Left: 50%; top:
50%;
Margin-left:-170px;
Margin-top:-70px; position: absolute;
Background: # BBBBBB;
}
</Style>
</Head>
<Body>
<Form id = "form1" runat = "server">
<Div id = "center">
<Div id = "content">
Sssssssssssss
</Div>
</Div>
</Form>
</Body>
</Html>
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
