Margin between sibling : margin « CSS « HTML / CSS

HTML / CSS » CSS » margin 
Margin between sibling
  



<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
                      "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns='http://www.w3.org/1999/xhtml' xml:lang='en'>
    <head>
        <title>margin</title>
        <style rel='stylesheet' type='text/css'>
body {
    margin: 0;
    padding: 0;
}
div {
    width: 100px;
    height: 100px;
    background: lightyellow;
    border: 1px solid gold;
}
div#top {
    margin: 10px 20px;
}
div#bottom {
    margin: 20px;
}        
        </style>
    </head>
    <body>
        <div id='top'></div>
        <div id='bottom'></div>
    </body>
</html>

   
  
Related examples in the same category
1.'margin' Example
2.Margin with two values
3.Margin with three values
4.Margin with four values
5.margin: 2em
6.li margin: 0 0 0.25em 0 and padding
7.margin: auto
8.margin for top right left bottom
9.Margin collapse
10.Margin in four directions
11.right left margin
12.parent child margin
13.auto margin
14.The margin shorthand property can accept from one to four values.
15.When three values margin: the top is the first value, the right and left sides are the second value, and the bottom is the third value.
16.When two values margin: the top and bottom are the first value, right and left sides are the second value.
17.When one value is supplied to the margin shorthand property, all four sides are specified with that one value.
18.If the auto keyword is supplied for the left or right margins, the element that margin is applied to is aligned horizontally.
19.Margin collapsing happens when the top or bottom margin of one element comes into contact with the top or bottom margin of another element.
20.Margin collapsing also happens between parent and child elements.
21.margin auto.html
22.margin left auto
23.margin right auto
24.margin collapse 3
25.margin collapse for nested elements
26.margin collapse for nested elements with default padding
27.margin collapse for nested elements with padding
28.fixed double margin
29.Using a division element with margins
30.Use of margin and padding for block elements
31.Margin and padding for html
32.img margin-top: -96px; margin-left: -138px;
33.p line-height: 150%; margin-top: 10px; margin-left: 80px;
34.Padding and margin for List
35.Zero Page margin
36.fieldset border: 1px dotted #61B5CF;margin-top: 1.4em;padding: 0.6em;
37.A demonstration of the margin property
38.Margin settings
39.Columns with margin
40.* { padding: 0; margin: 0; }
41.Use Minus margin to hide
42.A negative margin
43.margin: 5px;
44.Color, font and text properties are inherited. Other properties, such as border, margin, and padding, are not inherited.
45.When all four margin values are provided, each is provided in order clockwise, beginning with the top property.
46.top and bottom margin
47.using margin to make offset
48.When all four values are provided, each is provided in order clockwise, beginning with the top property.
49.When three values are supplied, the top is the first, the right and left sides are the second, and the bottom is the third.
50.When two values are supplied to the margin shorthand property, the top and bottom are the first, right and left sides are the second.
51.margin sets the size of the margin surrounding the border.
52.A margin negative value moves it away from center.
53.margin: 1em; assigns the size of the font to margin (i.e., font-size multiplied by 1).
54.Set margin to 0
55.Set margin to '0 0 0.5em 0'
56.Define Margin with value and percent
57.Body margin to 10%
58.Body with margin: 5% 10% 0 10%
59.LI margin: 0.33em 0.5em 0.5em 1.5em
60.Add margin to offset block nearby
61.Use margin to align block to left
62.Use margin to align block to center
63.Use margin to align block to right
64.Margin between parent and children
65.Use margin to offset child
66.margin collapse 2
67.margin collapse with nested elements
68.double-margin
69.margin:0; assigns zero to margin. Zero is the only length that may be specified without a measurement.
70.Margin Collapsing
71.margin collapse nested elements padding
72.margin collapse nested elements default padding
73.margin collapse nested elements
74.double margin fixed
75.Margin collapsing with adjacent siblings.
java2s.com  | Contact Us | Privacy Policy
Copyright 2009 - 12 Demo Source and Support. All rights reserved.
All other trademarks are property of their respective owners.