User:Emma/Sandbox: Difference between revisions

Want an adless experience? Log in or Create an account.
no edit summary
mNo edit summary
No edit summary
Line 78: Line 78:
-moz-box-shadow: 0 -1px 1px #ddd;
-moz-box-shadow: 0 -1px 1px #ddd;
-webkit-box-shadow: 0 -1px 1px #ddd;">Example</div>
-webkit-box-shadow: 0 -1px 1px #ddd;">Example</div>
<span style="display:none;"><css>
.tabtest, .tabtestselected {
  float:left;
  width:100%;
  font-size:93%;
  margin: 0;
  padding: 0;
}
.tabtest ul, .tabtestselected ul {
  margin:0;
  padding:10px 10px 0;
  list-style:none !important;
}
.tabtest li, .tabtestselected li {
  float:left;
  margin:0 !important;
  text-align:center;
}
/* MediaWiki automatically removes links for the current page and surrounds it with <strong> tags instead */
.tabtest a,.tabtest strong {
  padding: 5px 15px 4px 6px;
  margin-right: 1px;
  margin-bottom: -1px;
  border: 1px solid #A6B4E7;
  border-bottom: 1px solid #AAA;
  float:left;
  display:block;
  text-decoration:none;
  font-weight:bold;
  color:black;
  -moz-border-radius-topleft: 8px;
  -moz-border-radius-topright: 8px;
  -moz-border-radius-bottomright: 0;
  -moz-border-radius-bottomleft: 0;
  border-radius: 8px 8px 0 0;
  -moz-border-radius: 8px 8px 0 0;
  -webkit-border-radius: 8px 8px 0 0;
  border-radius: 8px 8px 0 0;
  background: #c8d0ff;
  background: -moz-linear-gradient(top,#c8d0ff 0,#F9F9F9 100%);
  background: -webkit-gradient(linear,left top,left bottom,color-stop(0%,#c8d0ff),color-stop(100%,#F9F9F9));
  background: -webkit-linear-gradient(top,#c8d0ff 0,#F9F9F9 100%);
  background: -o-linear-gradient(top,#c8d0ff 0,#F9F9F9 100%);
  background: -ms-linear-gradient(top,#c8d0ff 0,#F9F9F9 100%);
  background: linear-gradient(top,#c8d0ff 0,#F9F9F9 100%);
}
/* Commented Backslash Hack
  hides rule from IE5-Mac \*/
.tabtest a:hover {float:none;}
/* End IE5-Mac hack */
.tabtest a:hover {
  color:#A6B4E7;
}
.tabtest a:hover, .tabtest strong:hover, .tabtestselected a, .tabtestselected strong{
  padding: 5px 15px 4px 6px;
  margin-right: 1px;
  margin-bottom: -1px;
  border: 1px solid #A6B4E7;
  font-weight: bold;
  -moz-border-radius-topleft: 8px;
  -moz-border-radius-topright: 8px;
  -moz-border-radius-bottomright: 0;
  -moz-border-radius-bottomleft: 0;
  border-radius: 8px 8px 0 0;
  -moz-border-radius: 8px 8px 0 0;
  -webkit-border-radius: 8px 8px 0 0;
  border-radius: 8px 8px 0 0;
  margin-bottom: -1px;
  border-bottom: 1px solid #F9F9F9!important;
  color: black;
  background: white;
  background: -moz-linear-gradient(top,white 0,#E5E5E5 5%,#F9F9F9 55%);
  background: -webkit-gradient(linear,left top,left bottom,color-stop(0%,white),color-stop(5%,#E5E5E5),color-stop(55%,#F9F9F9));
  background: -webkit-linear-gradient(top,white 0,#E5E5E5 5%,#F9F9F9 55%);
  background: -o-linear-gradient(top,white 0,#E5E5E5 5%,#F9F9F9 55%);
  background: -ms-linear-gradient(top,white 0,#E5E5E5 5%,#F9F9F9 55%);
  background: linear-gradient(top,white 0,#E5E5E5 5%,#F9F9F9 55%);
  box-shadow: 0 -1px 1px #ddd;
  -moz-box-shadow: 0 -1px 1px #ddd;
  -webkit-box-shadow: 0 -1px 1px #ddd;
}
.tabcontent {
  border: 1px solid #AAA;
  padding: 0em 1em 1em 1em;
  background-color:#F9F9F9;
  color:#000;
  clear: left;
}
</css></span>
<div class="tabtest">
<ul>
<li><span class="_toggler_hide-tabs _toggler_show-tab1 _toggler_hide-stabs _toggler_show-utabs _toggler_hide-utab1 _toggler_show-stab1 utab1 utabs" style="display:none;">tab1</span><span class="_toggler-utab1 _toggler-stab1 stab1 stabs tabtestselected" style="font-size: 100%!important;">tab1</span></li>
<li><span class="_toggler_hide-tabs _toggler_show-tab2 _toggler_hide-stabs _toggler_show-utabs _toggler_hide-utab2 _toggler_show-stab2 utab2 utabs">tab2</span><span class="_toggler-utab2 _toggler-stab2 stab2 stabs tabtestselected" style="display:none; font-size: 100%!important;">tab2</span></li>
<li><span class="_toggler_hide-tabs _toggler_show-tab3 _toggler_hide-stabs _toggler_show-utabs _toggler_hide-utab3 _toggler_show-stab3 utab3 utabs">tab3</span><span class="_toggler-utab3 _toggler-stab3 stab3 stabs tabtestselected" style="display:none; font-size: 100%!important;">tab3</span></li>
</ul>
</div>
<div class="tabcontent">
{{toggle|Tab 1||tab1 tabs}}
{{toggle||Tab 2|tab2 tabs}}
{{toggle||Tab 3|tab3 tabs}}
</div>