Summary of CSS Margin-left and margin-right usage methods

Generally in CSS styles, use the margin property to set the margin. If you need only one side of the margin, you can use the unilateral margin property to set the value for the margin on the element's unilateral edge. Use the Margin-left property to set the left margin of the element. Use the Margin-right property to set the right margin of the element. They have a default value of 0. You can set the specific unit value in the actual use, or you can set the form as a percentage. This article summarizes how margin-left and Margin-right are used.

First, about the use of margin-left attributes

1. CSS Margin Analysis

Margin-left negative values combine floating implementations without altering the fluid layout of the DOM structure. When the value of the margin property is a percentage, it is always calculated as the base of the parent element's width.

2. CSS Memo (margin-left)

Set margin: Margin-top,margin-left,margin-right,margin-bottom

P Background Sheet Overlay setting: width:30px; height:30px; line-height:30px; Background-image:url (.. /image/lzhf/one.png); Background-repeat:no-repeat; background-size:100% Auto;

3. Margin-left instance Usage

Retrieves or sets the extension margin to the left of the object. Parameter Introduction Auto: Value is set to the value of the relative edge. Length: A value consisting of a floating-point number and a unit identifier | or a percentage. Percentages are based on the height of the parent object.

Description retrieves or sets the extension margin to the left of the object. Inline object to use this property, you must first set the height or width property of the object, or set the Position property to absolute. The Ie4+,margin property is not available for TD and TR objects.

The extended margins are always transparent. the corresponding script attribute is marginleft.

Second, about the use of margin-right attributes

1. Three basic positioning mechanisms in CSS (Margin-right,margin-left)

The preferred way to center elements horizontally in CSS is to use the margin property-set the Margin-left and Margin-right properties of the element to auto. In practical use, we can create a container-action p for these elements that need to be centered. It is important to note that you must specify a width for the container.

2. CSS Layout Various center summary (margin-right,margin-left)

Centering is often the case when we use CSS to lay out the layout. When using CSS to center, sometimes a property can be done, sometimes requires a certain skill to be compatible with all browsers, specifically to center the elements of the Margin-left and Margin-right are set to auto, this method can only be horizontally centered, and is not valid for floating or absolutely positioned elements.

3. CSS implementation examples of various column layouts for pages (margin-right,margin-left)

A column layout needs to master 3 knowledge points: The standard document flow, which also contains block-level elements and row-level elements, as well as the margin property, can be said to implement a column layout of the key code is implemented by the margin property, by setting margin:0 auto, to achieve horizontal centering, Auto is that it automatically sets the margins on both sides based on the width of the browser. To set margin, you first have to have a box model, such as p here, and then set its length and width to a fixed size to be centered.

Double Wing layout This is the margin-left of the main column and the margin-right is larger than the width of the left and right columns, you can set the gap between the primary column and the child column.

Margin-left and Margin-right Properties related questions and Answers

1. CSS ("margin-left") bit null??? I'm confused.

2. Margin-right not work?

3. The following code, already used Margin-left:auto, why still can't center?

"Recommended"

1. css margin margin properties and usage summary