how to make div centered in css

Use Div and CSS to create triangle effects:This section describes how to use the div and CSS to achieve the triangle effect, although it looks like the table is magical, but the principle is very simple.The code is as follows:DOCTYPE HTML>HTML>Head>MetaCharSet= "Utf-8">Metaname= "Author"content= "http://www.softwhy.com

css| Web page The Web pages that meet the standards are DIV+CSS made, so are table tables that we used to be useful? Do you want to give up completely? About the use of div and table tables There are many people are very confused, sorting out the idea! 　　About tables After using web standards, it's not about excluding

-left-color:For example:border-left-width:1px;Border-left-style: solid; Border-left-color: #000000; Note:In the page app, the set of border also occupies the page space. So, when the layout is accurately calculated,Even in the case of border 1px, it is important to take into account the influence of border on width and height.2. CSS padding (padding) propertiesProperties: Padding (padding-top, padding-right, Padding-bottom, padding-left) Propert

css| Beginners | Web page Many of the people I contacted asked how to learn Web standards to make Web pages. I think everyone who has just contacted the Web standards will ask such questions, and I will summarize them according to my own experience. 1. Do not blindly use the DW and other tools to design Web pages to familiarize yourself with (X) HTML and CSS lang

HTML fileCSS file*{margin:0px;p adding:0px;} #top {width:100%;height:50px;background-color: #000000;} #top_nav {width:75%;height:50px;margin:0px auto;background-color: #004488;} #body {margin:10px auto;width:75%;height:1500px;background-color: #00FF77;} #body_image {margin:0px;width:100%;height:400px;background-color: #FF0000;} #body_content {margin:0px;width:100%;height:1100px;background-color:antiquewhite;} #body_no {margin:0px;width:100%;height:50px;background-color:blue;} #body_c {margin:0px

DIV + CSS as a summary of the mistakes that are easy to make on the Web page 1. Check whether the HTML element has a spelling error and whether it has forgotten the ending mark. Even veteran engineers often mistake the nested relationship of p. You can use the dreamweaver verification function to check whether there are any errors. 2. Check whether

style>. Cube{width:200px;Height:200px;margin:100px Auto;position:relative; /*perspective:1000px;*/Transform:Rotatex (30deg) Rotatey (30deg);Transform-style:preserve-3d; }. Front,. Back,. Top,. Bottom,.{width:200px;Height:200px;font-family:"Microsoft Yahei";Line-height:200px;text-align:Center;position:Absolute;Top:0; Left:0;Opacity:0.5; }. Front{Background-color:#008000;Transform:Translatez (100px); }. Back{Background-color:#ffff00;Transform:Translatez ( -100px);

This article mainly introduces the way to let div fill the entire screen (CSS), has a certain reference value, now share to everyone, the need for friends can refer to When the body has only one P, you can make P fill the entire screen in such a way. 1. Set the positioning for P. 　　Review-- There are five properties of position in

Ideas:1. Because it is a vertical list, the outer layer is relatively positioned so that it does not overlap together relative2. Absolute the inside with absolute position, cover the picture above3. Here is a little trick, I have a special effect, text erect, and rotate to the right 90 degrees (WebKit core) width:20px; font-size:20px; -webkit-transform:rotate (90DEG);"position:relative; max-width:560px; min-height:115px ;">"/resources/images/hongbao_ky.png"style="width:100%; max-width:560px; min

of the table depends on the length of its text), so it can be regarded as a fixed-width block element , and then the method of the fixed-width blocky-centered margin is used to center it horizontally.　　　　　　2, by setting the child element Display:inline method: Similar to the first, the display type is set to the inline element, the property of the variable width element is set 3. By setting float to the parent element and then setting position:rela

How do I get content vertically centered in a div source: Huang ChaoTo make the content in the div vertically centered, there are only a few ways, and so I enumerate:First, row height (line-height) methodIf you want to vertically center only one line or a few words, it is th

create a vertical center effect.link { padding-top: 30px; padding-bottom: 30px;}=code Example 2:When a padding fill is not appropriate in some cases, you can make its text line height = The parent element's height is centered vertically.=>html Code=>CSS Codebody { background: #f06d06; font-size: 80%;}main { background: white; margin: 20px 0; padding: 40px

In general, we say that there are two kinds of center, the center of the layer and the center of the layer, the center of the layer I generally use: margin:0 auto; (or Margin-left:auto;margin-right:auto;) This type of writing, in the middle of the layer (I am generally used in layers of text): Text-align:center; This code can be centered in FF, but not in IE6/7/8. Replaced by: Margin-right:auto; Margin-left:auto, and also, the right margin:0pt 0pt 0p

vertically centered, we're horizontally centered. div>div>div> CSS Section #vc {display:table;Background-color:#C2300B;Width500pxHeight200pxOverflowHiddenMargin-left:50px _PositionRelative }#vci {Vertical-align:Middl

First look at the following: Here is the CSS code: Here is the HTML code: H3>Implement images with unknown dimensions, single line of text, horizontal vertical centering of multiline textH3> Divclass= "Wrap"> Divclass= "Subwrap"> Divclass= "Content"> imgsrc= "Http://static.cnblogs.com/images/logo_small.gif" /> Div>