mozilla

Compare Revisions

z-index

Change Revisions

Revision 494531:

Revision 494531 by kscarfone on

Revision 508173:

Revision 508173 by tregagnon on

Title:
z-index
z-index
Slug:
Web/CSS/z-index
Web/CSS/z-index
Tags:
"CSS", "NeedsLiveSample", "NeedsMobileBrowserCompatibility", "Web", "Layout", "Reference", "CSS Property"
"NeedsMobileBrowserCompatibility", "CSS", "Reference", "Référence", "Web", "CSS Property", "NeedsLiveSample", "Layout"
Content:

Revision 494531
Revision 508173
t62    <div style="border:dashed; position:relative; z-index:1; heigt62    <pre class="brush: html">
>ht:8em; margin-bottom:1em;margin-top: 2em;"> 
63      position:relative; z-index:1; <span style="background:gold;63&lt;div class="dashed-box"&gt;Dashed box
> position:absolute; z-index:2; left:60px; top:3em;">position:abso 
>lute; z-index:2; left:60px; top:3em;</span> <span style="backgrou 
>nd:lightgreen; position:absolute; z-index:3; left:20em; top:-25px 
>; height:7em; opacity:0.9">position:absolute; z-index:3;<br> 
64      left:20em; top:-25px; opacity:0.9</span>64  &lt;span class="gold-box"&gt;Gold box&lt;/span&gt;
65  &lt;span class="green-box"&gt;Green box&lt;/span&gt;
66&lt;/div&gt;
67</pre>
68    <pre class="brush: css">
69.dashed-box { 
70  position: relative;
71  z-index: 1;
72  border: dashed;
73  height: 8em;
74  margin-bottom: 1em;
75  margin-top: 2em;
76}
77.gold-box { 
78  position: absolute;
79  z-index: 2;
80  background: gold;
81  left: 60px;
82  top: 3em;
83}
84.green-box { 
85  position: absolute;
86  z-index: 3;
87  background: lightgreen;
88  left: 20em;
89  top: -25px;
90  height: 7em;
91  opacity: 0.9
92}
93</pre>
94    <p>
95      {{ EmbedLiveSample('Examples', '550', '200', '') }}
65    </div>96    </p>
97    <p>
98      &nbsp;
99    </p>

Back to History