Bumping manifests a=b2g-bump
[gecko.git] / layout / style / html.css
blob9e83101a82df42dd4b96b40b6b761d4bbb346769
1 /* This Source Code Form is subject to the terms of the Mozilla Public
2 * License, v. 2.0. If a copy of the MPL was not distributed with this
3 * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
5 @namespace url(http://www.w3.org/1999/xhtml); /* set default namespace to HTML */
6 @namespace xul url(http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul);
8 /* bidi */
10 [dir="rtl"] {
11 direction: rtl;
12 unicode-bidi: embed;
14 [dir="ltr"] {
15 direction: ltr;
16 unicode-bidi: embed;
19 bdi:-moz-dir(ltr), [dir="auto"]:-moz-dir(ltr) { direction: ltr; }
20 bdi:-moz-dir(rtl), [dir="auto"]:-moz-dir(rtl) { direction: rtl; }
22 /* To ensure http://www.w3.org/TR/REC-html40/struct/dirlang.html#style-bidi:
24 * "When a block element that does not have a dir attribute is transformed to
25 * the style of an inline element by a style sheet, the resulting presentation
26 * should be equivalent, in terms of bidirectional formatting, to the
27 * formatting obtained by explicitly adding a dir attribute (assigned the
28 * inherited value) to the transformed element."
30 * and the rules in http://dev.w3.org/html5/spec/rendering.html#rendering
33 address, address[dir],
34 article, article[dir],
35 aside, aside[dir],
36 blockquote, blockquote[dir],
37 body, body[dir],
38 caption, caption[dir],
39 center, center[dir],
40 col, col[dir],
41 colgroup, colgroup[dir],
42 dd, dd[dir],
43 dir, dir[dir],
44 div, div[dir],
45 dl, dl[dir],
46 dt, dt[dir],
47 fieldset, fieldset[dir],
48 figcaption, figcaption[dir],
49 figure, figure[dir],
50 footer, footer[dir],
51 form, form[dir],
52 h1, h1[dir],
53 h2, h2[dir],
54 h3, h3[dir],
55 h4, h4[dir],
56 h5, h5[dir],
57 h6, h6[dir],
58 header, header[dir],
59 hgroup, hgroup[dir],
60 hr, hr[dir],
61 html, html[dir],
62 legend, legend[dir],
63 li, li[dir],
64 listing, listing[dir],
65 main, main[dir],
66 marquee, marquee[dir],
67 menu, menu[dir],
68 nav, nav[dir],
69 noframes, noframes[dir],
70 ol, ol[dir],
71 p, p[dir],
72 plaintext, plaintext[dir],
73 pre, pre[dir],
74 section, section[dir],
75 summary, summary[dir],
76 table, table[dir],
77 tbody, tbody[dir],
78 td, td[dir],
79 tfoot, tfoot[dir],
80 th, th[dir],
81 thead, thead[dir],
82 tr, tr[dir],
83 ul, ul[dir],
84 xmp, xmp[dir] {
85 unicode-bidi: -moz-isolate;
88 bdi, bdi[dir], output, output[dir], [dir="auto"] {
89 unicode-bidi: -moz-isolate;
91 bdo, bdo[dir] {
92 unicode-bidi: bidi-override;
94 bdo[dir="auto"] {
95 unicode-bidi: -moz-isolate-override;
97 textarea[dir="auto"], pre[dir="auto"] { unicode-bidi: -moz-plaintext; }
99 /* blocks */
101 article,
102 aside,
103 div,
105 figcaption,
106 footer,
107 form,
108 header,
109 hgroup,
110 html,
111 main,
112 nav,
113 section {
114 display: block;
117 body {
118 display: block;
119 margin: 8px;
122 p, dl, multicol {
123 display: block;
124 margin: 1em 0;
127 dd {
128 display: block;
129 -moz-margin-start: 40px;
132 blockquote, figure {
133 display: block;
134 margin: 1em 40px;
137 address {
138 display: block;
139 font-style: italic;
142 center {
143 display: block;
144 text-align: -moz-center;
147 blockquote[type=cite] {
148 display: block;
149 margin: 1em 0px;
150 -moz-padding-start: 1em;
151 -moz-border-start: solid;
152 border-color: blue;
153 border-width: thin;
156 span[_moz_quote=true] {
157 color: blue;
160 pre[_moz_quote=true] {
161 color: blue;
164 h1 {
165 display: block;
166 font-size: 2em;
167 font-weight: bold;
168 margin: .67em 0;
172 :-moz-any(article, aside, nav, section)
173 h1 {
174 display: block;
175 font-size: 1.5em;
176 font-weight: bold;
177 margin: .83em 0;
181 :-moz-any(article, aside, nav, section)
182 :-moz-any(article, aside, nav, section)
183 h1 {
184 display: block;
185 font-size: 1.17em;
186 font-weight: bold;
187 margin: 1em 0;
191 :-moz-any(article, aside, nav, section)
192 :-moz-any(article, aside, nav, section)
193 :-moz-any(article, aside, nav, section)
194 h1 {
195 display: block;
196 font-size: 1.00em;
197 font-weight: bold;
198 margin: 1.33em 0;
202 :-moz-any(article, aside, nav, section)
203 :-moz-any(article, aside, nav, section)
204 :-moz-any(article, aside, nav, section)
205 :-moz-any(article, aside, nav, section)
206 h1 {
207 display: block;
208 font-size: 0.83em;
209 font-weight: bold;
210 margin: 1.67em 0;
214 :-moz-any(article, aside, nav, section)
215 :-moz-any(article, aside, nav, section)
216 :-moz-any(article, aside, nav, section)
217 :-moz-any(article, aside, nav, section)
218 :-moz-any(article, aside, nav, section)
219 h1 {
220 display: block;
221 font-size: 0.67em;
222 font-weight: bold;
223 margin: 2.33em 0;
226 listing {
227 display: block;
228 font-family: -moz-fixed;
229 font-size: medium;
230 white-space: pre;
231 margin: 1em 0;
234 xmp, pre, plaintext {
235 display: block;
236 font-family: -moz-fixed;
237 white-space: pre;
238 margin: 1em 0;
241 /* tables */
243 table {
244 display: table;
245 border-spacing: 2px;
246 border-collapse: separate;
247 margin-top: 0;
248 margin-bottom: 0;
249 /* XXXldb do we want this if we're border-collapse:collapse ? */
250 box-sizing: border-box;
251 text-indent: 0;
254 table[align="left"] {
255 float: left;
258 table[align="right"] {
259 float: right;
260 text-align: start;
264 /* border collapse rules */
266 /* Set hidden if we have 'frame' or 'rules' attribute.
267 Set it on all sides when we do so there's more consistency
268 in what authors should expect */
270 /* Put this first so 'border' and 'frame' rules can override it. */
271 table[rules] {
272 border-width: thin;
273 border-style: hidden;
276 /* 'border' before 'frame' so 'frame' overrides
277 A border with a given value should, of course, pass that value
278 as the border-width in pixels -> attr mapping */
280 /* :-moz-table-border-nonzero is like [border]:not([border="0"]) except it
281 also checks for other zero-like values according to HTML attribute
282 parsing rules */
283 table:-moz-table-border-nonzero {
284 border-width: thin;
285 border-style: outset;
288 table[frame] {
289 border: thin hidden;
292 /* specificity must beat table:-moz-table-border-nonzero rule above */
293 table[frame="void"] { border-style: hidden; }
294 table[frame="above"] { border-style: outset hidden hidden hidden; }
295 table[frame="below"] { border-style: hidden hidden outset hidden; }
296 table[frame="lhs"] { border-style: hidden hidden hidden outset; }
297 table[frame="rhs"] { border-style: hidden outset hidden hidden; }
298 table[frame="hsides"] { border-style: outset hidden; }
299 table[frame="vsides"] { border-style: hidden outset; }
300 table[frame="box"],
301 table[frame="border"] { border-style: outset; }
304 /* Internal Table Borders */
306 /* 'border' cell borders first */
308 table:-moz-table-border-nonzero > * > tr > td,
309 table:-moz-table-border-nonzero > * > tr > th,
310 table:-moz-table-border-nonzero > * > td,
311 table:-moz-table-border-nonzero > * > th,
312 table:-moz-table-border-nonzero > td,
313 table:-moz-table-border-nonzero > th
315 border-width: thin;
316 border-style: inset;
319 /* collapse only if rules are really specified */
320 table[rules]:not([rules="none"]):not([rules=""]) {
321 border-collapse: collapse;
324 /* only specified rules override 'border' settings
325 (increased specificity to achieve this) */
326 table[rules]:not([rules=""])> tr > td,
327 table[rules]:not([rules=""])> * > tr > td,
328 table[rules]:not([rules=""])> tr > th,
329 table[rules]:not([rules=""])> * > tr > th,
330 table[rules]:not([rules=""])> td,
331 table[rules]:not([rules=""])> th
333 border-width: thin;
334 border-style: none;
338 table[rules][rules="none"] > tr > td,
339 table[rules][rules="none"] > * > tr > td,
340 table[rules][rules="none"] > tr > th,
341 table[rules][rules="none"] > * > tr > th,
342 table[rules][rules="none"] > td,
343 table[rules][rules="none"] > th
345 border-width: thin;
346 border-style: none;
349 table[rules][rules="all"] > tr > td,
350 table[rules][rules="all"] > * > tr > td,
351 table[rules][rules="all"] > tr > th,
352 table[rules][rules="all"] > * > tr > th,
353 table[rules][rules="all"] > td,
354 table[rules][rules="all"] > th
356 border-width: thin;
357 border-style: solid;
360 table[rules][rules="rows"] > tr,
361 table[rules][rules="rows"] > * > tr {
362 border-top-width: thin;
363 border-bottom-width: thin;
364 border-top-style: solid;
365 border-bottom-style: solid;
369 table[rules][rules="cols"] > tr > td,
370 table[rules][rules="cols"] > * > tr > td,
371 table[rules][rules="cols"] > tr > th,
372 table[rules][rules="cols"] > * > tr > th {
373 border-left-width: thin;
374 border-right-width: thin;
375 border-left-style: solid;
376 border-right-style: solid;
379 table[rules][rules="groups"] > colgroup {
380 border-left-width: thin;
381 border-right-width: thin;
382 border-left-style: solid;
383 border-right-style: solid;
385 table[rules][rules="groups"] > tfoot,
386 table[rules][rules="groups"] > thead,
387 table[rules][rules="groups"] > tbody {
388 border-top-width: thin;
389 border-bottom-width: thin;
390 border-top-style: solid;
391 border-bottom-style: solid;
395 /* caption inherits from table not table-outer */
396 caption {
397 display: table-caption;
398 text-align: center;
401 table[align="center"] > caption {
402 margin-left: auto;
403 margin-right: auto;
406 table[align="center"] > caption[align="left"] {
407 margin-right: 0;
410 table[align="center"] > caption[align="right"] {
411 margin-left: 0;
414 tr {
415 display: table-row;
416 vertical-align: inherit;
419 col {
420 display: table-column;
423 colgroup {
424 display: table-column-group;
427 tbody {
428 display: table-row-group;
429 vertical-align: middle;
432 thead {
433 display: table-header-group;
434 vertical-align: middle;
437 tfoot {
438 display: table-footer-group;
439 vertical-align: middle;
442 /* for XHTML tables without tbody */
443 table > tr {
444 vertical-align: middle;
447 td {
448 display: table-cell;
449 vertical-align: inherit;
450 text-align: inherit;
451 padding: 1px;
454 th {
455 display: table-cell;
456 vertical-align: inherit;
457 font-weight: bold;
458 padding: 1px;
461 tr > form:-moz-is-html, tbody > form:-moz-is-html,
462 thead > form:-moz-is-html, tfoot > form:-moz-is-html,
463 table > form:-moz-is-html {
464 /* Important: don't show these forms in HTML */
465 display: none !important;
468 table[bordercolor] > tbody,
469 table[bordercolor] > thead,
470 table[bordercolor] > tfoot,
471 table[bordercolor] > col,
472 table[bordercolor] > colgroup,
473 table[bordercolor] > tr,
474 table[bordercolor] > * > tr,
475 table[bordercolor] > tr > td,
476 table[bordercolor] > * > tr > td,
477 table[bordercolor] > tr > th,
478 table[bordercolor] > * > tr > th {
479 border-color: inherit;
482 /* inlines */
484 q:before {
485 content: open-quote;
488 q:after {
489 content: close-quote;
492 b, strong {
493 font-weight: bolder;
496 i, cite, em, var, dfn {
497 font-style: italic;
500 tt, code, kbd, samp {
501 font-family: -moz-fixed;
504 u, ins {
505 text-decoration: underline;
508 s, strike, del {
509 text-decoration: line-through;
512 big {
513 font-size: larger;
516 small {
517 font-size: smaller;
520 sub {
521 vertical-align: sub;
522 font-size: smaller;
523 line-height: normal;
526 sup {
527 vertical-align: super;
528 font-size: smaller;
529 line-height: normal;
532 nobr {
533 white-space: nowrap;
536 mark {
537 background: yellow;
538 color: black;
541 /* titles */
542 abbr[title], acronym[title] {
543 border-bottom: dotted 1px;
546 /* lists */
548 ul, menu, dir {
549 display: block;
550 list-style-type: disc;
551 margin: 1em 0;
552 -moz-padding-start: 40px;
555 menu[type="context"] {
556 display: none !important;
559 ol {
560 display: block;
561 list-style-type: decimal;
562 margin: 1em 0;
563 -moz-padding-start: 40px;
566 li {
567 display: list-item;
570 /* nested lists have no top/bottom margins */
571 :-moz-any(ul, ol, dir, menu, dl) ul,
572 :-moz-any(ul, ol, dir, menu, dl) ol,
573 :-moz-any(ul, ol, dir, menu, dl) dir,
574 :-moz-any(ul, ol, dir, menu, dl) menu,
575 :-moz-any(ul, ol, dir, menu, dl) dl {
576 margin-top: 0;
577 margin-bottom: 0;
580 /* 2 deep unordered lists use a circle */
581 :-moz-any(ol, ul, menu, dir) ul,
582 :-moz-any(ol, ul, menu, dir) menu,
583 :-moz-any(ol, ul, menu, dir) dir {
584 list-style-type: circle;
587 /* 3 deep (or more) unordered lists use a square */
588 :-moz-any(ol, ul, menu, dir) :-moz-any(ol, ul, menu, dir) ul,
589 :-moz-any(ol, ul, menu, dir) :-moz-any(ol, ul, menu, dir) menu,
590 :-moz-any(ol, ul, menu, dir) :-moz-any(ol, ul, menu, dir) dir {
591 list-style-type: square;
595 /* leafs */
597 /* <hr> noshade and color attributes are handled completely by
598 * the nsHTMLHRElement attribute mapping code
600 hr {
601 display: block;
602 height: 2px;
603 border: 1px inset;
604 margin: 0.5em auto 0.5em auto;
605 color: gray;
606 -moz-float-edge: margin-box;
607 box-sizing: border-box;
610 hr[size="1"] {
611 border-style: solid none none none;
614 img:-moz-broken::before, input:-moz-broken::before,
615 img:-moz-user-disabled::before, input:-moz-user-disabled::before,
616 img:-moz-loading::before, input:-moz-loading::before,
617 applet:-moz-empty-except-children-with-localname(param):-moz-broken::before,
618 applet:-moz-empty-except-children-with-localname(param):-moz-user-disabled::before {
619 content: -moz-alt-content !important;
620 unicode-bidi: -moz-isolate;
623 :-moz-any(object,applet):-moz-any(:-moz-broken,:-moz-user-disabled) > *|* {
625 Inherit in the object's alignment so that if we aren't aligned explicitly
626 we'll end up in the right place vertically. See bug 36997. Note that this
627 is not !important because we _might_ be aligned explicitly.
629 vertical-align: inherit;
632 img:-moz-suppressed, input:-moz-suppressed, object:-moz-suppressed,
633 embed:-moz-suppressed, applet:-moz-suppressed {
635 Set visibility too in case the page changes display. Note that we _may_
636 want to just set visibility and not display, in general, if we find that
637 display:none breaks too many layouts. And if we decide we really do want
638 people to be able to right-click blocked images, etc, we need to set
639 neither one, and hack the painting code.... :(
641 display: none !important;
642 visibility: hidden !important;
645 img[usemap], object[usemap] {
646 color: blue;
649 frameset {
650 display: block ! important;
651 overflow: -moz-hidden-unscrollable;
652 position: static ! important;
653 float: none ! important;
654 border: none ! important;
657 link {
658 display: none;
661 frame {
662 border-radius: 0 ! important;
665 iframe {
666 border: 2px inset;
669 noframes {
670 display: none;
673 spacer {
674 position: static ! important;
675 float: none ! important;
678 canvas {
679 -moz-user-select: none;
682 /* focusable content: anything w/ tabindex >=0 is focusable, but we
683 skip drawing a focus outline on a few things that handle it
684 themselves. */
685 :-moz-focusring:not(input):not(button):not(select):not(textarea):not(iframe):not(frame):not(body):not(html) {
686 /* Don't specify the outline-color, we should always use initial value. */
687 outline: 1px dotted;
690 /* hidden elements */
691 base, basefont, datalist, head, meta, script, style, title,
692 noembed, param, template {
693 display: none;
696 area {
697 /* Don't give it frames other than its imageframe */
698 display: none ! important;
701 iframe:-moz-full-screen {
702 /* iframes in full-screen mode don't show a border. */
703 border: none;
706 /* media elements */
707 video > xul|videocontrols, audio > xul|videocontrols {
708 display: -moz-box;
709 -moz-box-orient: vertical;
710 -moz-binding: url("chrome://global/content/bindings/videocontrols.xml#videoControls");
713 video:not([controls]) > xul|videocontrols,
714 audio:not([controls]) > xul|videocontrols {
715 visibility: hidden;
716 -moz-binding: none;
719 audio:not([controls]) {
720 display: none;
723 *|*::-moz-html-canvas-content {
724 display: block !important;
725 /* we want to be an absolute and fixed container */
726 -moz-transform: translate(0) !important;
729 video > .caption-box {
730 position: relative;
731 overflow: hidden;
734 /* emulation of non-standard HTML <marquee> tag */
735 marquee {
736 width: -moz-available;
737 display: inline-block;
738 vertical-align: text-bottom;
739 text-align: start;
740 -moz-binding: url('chrome://xbl-marquee/content/xbl-marquee.xml#marquee-horizontal');
743 marquee[direction="up"], marquee[direction="down"] {
744 -moz-binding: url('chrome://xbl-marquee/content/xbl-marquee.xml#marquee-vertical');
745 height: 200px;
748 /* PRINT ONLY rules follow */
749 @media print {
751 marquee { -moz-binding: none; }