Search completed in 0.83 seconds.
create fancy boxes - Learn web development
css
boxes are the building blocks of any web page styled with css.
...let's do some fancy
boxes.
... on the technical side, creating fancy
boxes are all about mastering css border and background properties and how to apply them to a given box.
...And 4 more matches
Tabboxes - Archive of obsolete content
tab
boxes tab
boxes are typically used in an application in the preferences window.
... there is really nothing special about the tab elements that make them different than
boxes.
... like
boxes, tabs can contain any element.
...And 2 more matches
Groupboxes - Archive of obsolete content
« previousnext » this section describes a way to include elements into groups group
boxes the groupbox element is used to group related xul elements together, much like the html fieldset element is used to group html elements.
...however, there are several differences between group
boxes and regular
boxes: the groupbox can be labeled using the caption element.
...group
boxes are box elements, so you can use the box attributes, such as orient and flex.
...any radio buttons placed inside the radio group will be grouped together, even if they are inside nested
boxes.
Visual formatting model - CSS: Cascading Style Sheets
in the visual formatting model, each element in the document tree generates zero or more
boxes according to the box model.
... the layout of these
boxes is governed by: box dimensions and type.
... box generation box generation is the part of the css visual formatting model that creates
boxes from the document's elements.
...And 30 more matches
Block and inline layout in normal flow - CSS: Cascading Style Sheets
normal flow is defined in the css 2.1 specification, which explains that any
boxes in normal flow will be part of a formatting context.
...we describe block-level
boxes as participating in a block formatting context, and inline-level
boxes as participating in an inline formatting context.
...for elements with a block formatting context, the spec says: “in a block formatting context,
boxes are laid out one after the other, vertically, beginning at the top of a containing block.
...And 20 more matches
The box model - Learn web development
previous overview: building blocks next everything in css has a box around it, and understanding these
boxes is key to being able to create layouts with css, or to align items with other items.
... block and inline
boxes in css we broadly have two types of
boxes — block
boxes and inline
boxes.
... these characteristics refer to how the box behaves in terms of page flow, and in relation to other
boxes on the page: if a box is defined as a block, it will behave in the following ways: the box will break onto a new line.
...And 14 more matches
<input type="checkbox"> - HTML: Hypertext Markup Language
<input> elements of type checkbox are rendered by default as
boxes that are checked (ticked) when activated, like you might see in an official government paper form.
... note: radio buttons are similar to check
boxes, but with an important distinction — radio buttons are grouped into a set in which only one radio button can be selected at a time, whereas check
boxes allow you to turn single values on and off.
... where multiple controls exist, radio buttons allow one to be selected out of them all, whereas check
boxes allow multiple values to be selected.
...And 14 more matches
The Box Model - Archive of obsolete content
introduction to
boxes the main form of layout in xul is called the 'box model'.
... this model allows you to divide a window into a series of
boxes.
...by combining a series of
boxes, spacers and elements with flex and pack attributes, you can control the layout of a window.
...And 11 more matches
Advanced form styling - Learn web development
to recap what we said in the previous article, we have: the bad: some elements are more difficult to style, requiring more complex css or some more specific tricks: check
boxes and radio buttons <input type="search"> the ugly: some elements can't be styled thoroughly using css.
...in a couple of cases — search and radio buttons/check
boxes, it becomes way more useful.
... taming search
boxes <input type="search"> is basically just a text input, so why is appearance: none; useful here?
...And 10 more matches
Element Positioning - Archive of obsolete content
some elements, such as text
boxes have a default size, which will be used.
...this process repeats for as many nested
boxes as necessary.
...this unit is useful for text
boxes so that the font can change and the text
boxes would always be a suitable size, even if the font is very large.
...And 9 more matches
Index - Archive of obsolete content
93 loader/sandbox create javascript sand
boxes and execute scripts in them.
... 175
boxes code snippets make the box style="display: block" and the wrapping behavior will occur when the box is resized: 176 canvas code snippets canvas, code snippets, graphics no summary!
... 1741 adding more elements tutorials, xul, xul_tutorial we will conclude the discussion of
boxes by adding some
boxes to the find files dialog.
...And 8 more matches
Index - Learn web development
every time a web page does more than just sit there and display static information for you to look at—displaying timely content updates, interactive maps, animated 2d/3d graphics, scrolling video juke
boxes, or more—you can bet that javascript is probably involved.
... 104 a cool-looking box assessment, beginner, css, learn, backgrounds, borders, box, box model, effects in this assessment, you'll get some more practice in creating cool-looking
boxes by trying to create an eye-catching box.
... 105 advanced styling effects article, beginner, blend modes,
boxes, css, codingscripting, filters, styling, box shadows, effects, shapes we hope this article was fun — playing with shiny toys generally is, and it is always interesting to see what kinds of advanced styling tools are becoming available in modern browsers.
...And 7 more matches
Inline formatting context - CSS: Cascading Style Sheets
inline
boxes are laid out one after the other, in the direction sentences run in the writing mode in use: in a horizontal writing mode,
boxes are laid out horizontally, starting on the left.
...the
boxes in the horizontal writing mode run horizontally, and the vertical writing mode
boxes run vertically.
...
boxes forming a line are contained by a rectangular area called a line box.
...And 7 more matches
textbox - Archive of obsolete content
button, selectionend, selectionstart, size, spinbuttons, tabindex, textlength, timeout, type, value, valuenumber, wraparound methods decrease, increase, reset, select, setselectionrange style classes plain examples <vbox> <label control="your-name" value="enter your name:"/> <textbox id="your-name" value="john"/> </vbox> attributes cols type: integer for multiline text
boxes, the number of columns to display.
... increment type: integer the amount by which the curpos (for scroll bars) or value (for number
boxes and scale) attribute changes when the arrows are clicked(or scales are dragged).
...the default value is 100 for scales and infinity for number
boxes.
...And 6 more matches
Drawing and Event Handling - Plugins
the plug-in prints the part of the page it occupies, and the browser handles the rest of the printing process, including displaying print dialog
boxes, getting the printer device context, and, of course, printing the rest of the page.
...the browser displays the necessary print dialog
boxes and calls npp_print again.
... a full-page plug-in handles the print dialog
boxes and printing process as it sees fit.
...And 6 more matches
Implementing a Microsoft Active Accessibility (MSAA) Server - Accessibility
a set of system messages that confer accessibility-related events such as focus changes, changes to document content and state changes in ui objects like check
boxes.
...epending on project] event_object_reorder [important for mutating docs] event_object_focus [important] event_object_selection [important] event_object_selectionadd [important for multiple selection] event_object_selectionremove [important for multiple selection] event_object_selectionwithin [important for multiple selection] event_object_statechange [important for check
boxes and radio buttons] event_object_locationchange event_object_namechange event_object_descriptionchange event_object_valuechange [important for sliders and progress meters] event_object_parentchange event_object_helpchange event_object_defactionchange event_object_acceleratorchange msaa states cheat sheet for information on what each state does, see the msdn...
...unfortunately, some products can get confused by the vertical lines on other objects, such as list
boxes, even though those lines are not blinking.
...And 6 more matches
Chapter 3: Introduction to XUL—How to build a more intuitive UI - Archive of obsolete content
the xul box model in principle, xul lays out all ui components using combinations of two kinds of
boxes: horizontal and vertical.
...out"/> <hbox> <button label="horizontal1"/> <button label="horizontal2"/> </hbox> <label value="vertical layout"/> <vbox> <button label="vertical1"/> <button label="vertical2"/> </vbox> <label value="mixed"/> <hbox> <button label="mixed1"/> <vbox> <button label="mixed2"/> <button label="mixed3"/> </vbox> <button label="mixed4"/> </hbox> listing 3: horizontal and vertical
boxes figure 1: output of listing 3 there is also a grid element, which can be used for layouts similar to those achieved using the html table element, a stack element for layering other elements, and so on.
... all on-screen widgets are laid out using these
boxes, making complex interface designs possible.
...And 5 more matches
Index - Archive of obsolete content
1010 adding more elements tutorials, xul, xul_tutorial we will conclude the discussion of
boxes by adding some
boxes to the find files dialog.
... 1031 group
boxes tutorials, xul, xul_tutorial this section describes a way to include elements into groups 1032 input controls tutorials, xul, xul_tutorial xul has elements that are similar to the html form controls.
... 1038 list controls tutorials, xul, xul_tutorial xul has a number of types of elements for creating list
boxes.
...And 5 more matches
Accessible Toolkit Checklist
for example, lists of check
boxes are implemented in windows with images of checked and unchecked check
boxes.
... most widgets (like check
boxes) can have a label outside of themselves, which should focus the widget when clicked on, or when its mnemonic is pressed.
... in autocomplete text fields, make sure that the left or right arrow closes the popup and starts moving through the text letter by letter msaa support, including accessible value that holds text, protected for password fields and readonly for read-only fields check
boxes space bar to toggle msaa support, including checkbox state and statechange event sliders keyboard support for moving slider: arrow keys, home, end, pgup, pgdn msaa support including role_slider, accessible value, value change events progress bars msaa support including accessible name, value, name and value change events gr...
...And 5 more matches
Input Controls - Archive of obsolete content
text
boxes accept many of the same attributes as html input controls.
... the following example shows some text
boxes: example 1 : source view <label control="some-text" value="enter some text"/> <textbox id="some-text"/> <label control="some-password" value="enter a password"/> <textbox id="some-password" type="password" maxlength="8"/> multiline textbox the textbox examples above will create text inputs that can only be used for entering one line of text.
... check
boxes and radio buttons two additional elements are used for creating check
boxes and radio buttons.
...And 4 more matches
UI pseudo-classes - Learn web development
:checked, :indeterminate, and :default: respectively target check
boxes and radio buttons that are checked, in an indeterminate state (neither checked or not checked), and the default selected option when the page loads (e.g.
... radio and checkbox states — checked, default, indeterminate as we've seen in earlier articles in the module, radio buttons and check
boxes can be checked or unchecked.
... but there are a couple of other states to consider too: :default: matches radios/check
boxes that are checked by default, on page load (i.e.
...And 4 more matches
Browser detection using the user agent - HTTP
this effect can be easily achieved using css flex
boxes, sometimes with floats as a partial fallback.
...let us imagine a page composed of
boxes of information; each box is about a different feline breed or canine breed.
...for the purposes of grouping the content meaningfully, all the cat
boxes are separated from all the dog
boxes such that the cat and dog
boxes are not intermixed together.
...And 4 more matches
User Notifications and Alerts - Archive of obsolete content
they are thin
boxes that appear from beneath the tab list and above the page content, with some text and maybe a few buttons.
... notification
boxes are very easy to create, and are very customizable: let nb = gbrowser.getnotificationbox(); let acceptbutton = new object(); let declinebutton = new object(); let message = this._bundle.getstring("xulschoolhello.friendmessage.label"); let that = this; acceptbutton.label = this._bundle.getstring("xulschoolhello.acceptbutton.label"); acceptbutton.accesskey = this._bundle.getstring("xulsch...
... notification
boxes are designed to be easily dismissed.
...And 3 more matches
Box Model Details - Archive of obsolete content
we've added them to buttons and text
boxes, but we can also add them to spacers or
boxes.
...example 2 : source view <hbox flex="1" align="top"> <button label="left" style="min-width: 100px;" flex="1"/> <spacer flex="1"/> <button label="right" style="min-width: 100px;" flex="1"/> </hbox> summary of the box model to achieve complicated layouts, you will generally need to add nested
boxes, specify minimum and maximum sizes on some elements, and make certain elements flexible.
...the following is an outline of both types of
boxes: horizontal
boxes lay out their elements next to each other horizontally.
...And 3 more matches
Focus and Selection - Archive of obsolete content
if there are three text
boxes on a window, the one that has the focus is the one that the user can currently enter text into.
...this is because xul text
boxes are implemented using the html input widget, so the focus event is received for that element instead.
...for text
boxes, a special attribute, focused is added whenever the element has the focus.
...And 3 more matches
List Controls - Archive of obsolete content
« previousnext » xul has a number of types of elements for creating list
boxes.
... list
boxes a list box is used to display a number of items in a list.
...xul provides two types of elements to create lists, a listbox element to create multi-row list
boxes, and a menulist element to create drop-down list
boxes.
...And 3 more matches
Logical properties for margins, borders and padding - CSS: Cascading Style Sheets
in the example below i have created two
boxes and added different sized margins to each edge.
...try changing the direction property to rtl to cause the
boxes to display in a right-to-left direction, the margins on the first box will stay in the same place, while the margins on the inline dimension of the second box will switch.
... in the example below i have two
boxes, one of which is using physical padding properties and the other logical padding properties.
...And 3 more matches
align-self - CSS: Cascading Style Sheets
the property doesn't apply to block-level
boxes, or to table cells.
... normal the effect of this keyword is dependent of the layout mode we are in: in absolutely-positioned layouts, the keyword behaves like start on replaced absolutely-positioned
boxes, and as stretch on all other absolutely-positioned
boxes.
... for grid items, this keyword leads to a behavior similar to the one of stretch, except for
boxes with an aspect ratio or an intrinsic sizes where it behaves like start.
...And 3 more matches
Modules - Archive of obsolete content
this is made possible by the use of sand
boxes.
...we will show how sand
boxes and compartments can be used to improve security in our module system.
... exports: {} }; loader.loadsubscript(url, global); return global.exports; } among other things, this allows us to import loadscript to scripts being loaded, allowing them to load further scripts: // index.js: loadscript("www.foo.com/a.js", { loadscript: loadscript }).foo; => 5 // a.js: exports.foo = imports.loadscript("www.foo.com/b.js").bar; // b.js: exports.bar = 5; sand
boxes and compartments the loadscript function as defined in the previous section still has some serious shortcomings.
...And 2 more matches
The Box Model - Archive of obsolete content
any xul interface can be broken down into the following basic components:
boxes text images alignment and flexibility widths and heights margins and paddings menus, toolbar buttons, and even the most complex elements in xul are composed of these simple ingredients.
...
boxes a xul box is very similar to an html div.
...however, one of the fundamental differences between xul and html has been the fact that xul
boxes can be oriented vertically or horizontally (this behavior is being introduced into html standards).
...And 2 more matches
Things I've tried to do with XUL - Archive of obsolete content
(to add insult, xul layout code *explicitly* trims off '%' from width/height, thus treating it as pixels.) for reference, i'd like the following to give a vbox that resizes along with the window, with the green, red, and blue inside
boxes always maintaining a 30%-20%-50% ratio to the height of the parent vbox.
... is to use a div instead of a box container: <html:div style="-moz-box-flex: 1; width: 100%; height: 100%;"> <box style="height: 30%" flex="1" style="background: green;"/> <box style="height: 20%" flex="1" style="background: green;"/> <box style="height: 50%" flex="1" style="background: green;"/> </html:div> using flex="3" flex="2" flex="5" would give the right display visually for the empty
boxes; however, flex only applies to how empty space is allocated.
... so, as soon as you add a label or some other element inside, there will be a different amount of "empty space" to allocate in different
boxes.
...And 2 more matches
XUL element attributes - Archive of obsolete content
for
boxes that have horizontal orientation, it specifies how its children will be aligned vertically.
... for
boxes that have vertical orientation, it specifies how its children will be aligned horizontally.
... baseline this value applies to horizontally oriented
boxes only.
...And 2 more matches
CSS values and units - Learn web development
ems and rems em and rem are the two relative lengths you are likely to encounter most frequently when sizing anything from
boxes to text.
... in the below example the two percentage-sized
boxes and the two pixel-sized
boxes have the same class names.
... the difference is that the second set of two
boxes is inside a wrapper that is 400 pixels wide.
...And 2 more matches
Flexbox - Learn web development
specifying what elements to lay out as flexible
boxes to start with, we need to select which elements are to be laid out as flexible
boxes.
... the items being laid out as flexible
boxes inside the flex container are called flex items (the <article> elements in our example).
...for example, you could make the "blush" button appear at the start of the main axis using the following rule: button:last-child { order: -1; } nested flex
boxes it is possible to create some pretty complex layouts with flexbox.
...And 2 more matches
Legacy layout methods - Learn web development
prerequisites: html basics (study introduction to html), and an idea of how css works (study introduction to css and styling
boxes.) objective: to understand the fundamental concepts behind the grid layout systems used prior to css grid layout being available in browsers.
... on the top line we get twelve neat
boxes on the grid and they grow and shrink equally as we change the viewport width.
...you can see how the
boxes now never become wider than 960 pixels.
...And 2 more matches
Basic native form controls - Learn web development
it is used for creating most types of form widgets including single line text fields, time and date controls, controls without text input like check
boxes, radio buttons, and color pickers, and buttons.
... checkable items: check
boxes and radio buttons checkable items are controls whose state you can change by clicking on them or their associated labels.
...the associated <label> is generally placed immediately after the radio button or checkbox, with the instructions for the group of radio button or check
boxes generally being the content of the <legend>.
...And 2 more matches
Capabilities, constraints, and settings - Web APIs
edit the constraint sets for the video and audio tracks in the edit
boxes on the left, then click the "apply constraints" button to try them out.
... the actual settings the browser selected and is using are shown in the
boxes on the right.
...this display is updated by the function getcurrentsettings(), which gets the current settings for the audio and video tracks and inserts the corresponding code into the tracks' settings display
boxes by setting their value.
...And 2 more matches
CSS Box Alignment - CSS: Cascading Style Sheets
the css box alignment module specifies css features that relate to the alignment of
boxes in the various css box layout models: block layout, table layout, flex layout, and grid layout.
... baseline alignment the baseline alignment keywords are used to align the baselines of
boxes across a group of alignment subjects.
...the alignment subjects are baseline aligned against each other by adding padding inside the
boxes.
...And 2 more matches
Handling content breaks in multicol - CSS: Cascading Style Sheets
content is broken between column
boxes in multiple-column layout in the same way that it is broken between pages in paged media.
... there are various places we might want to control our breaks: breaks inside
boxes, for example inside a figure element.
... breaks before and after
boxes, which would include our heading example above.
...And 2 more matches
Styling Columns - CSS: Cascading Style Sheets
as column
boxes created inside multicol containers are anonymous
boxes, there is little we can do to style them.
... can i style the column
boxes?
...the anonymous
boxes that make up your columns can’t be targeted in any way, meaning it isn’t possible to change a box's background color or have one column larger than the others.
...And 2 more matches
place-self - CSS: Cascading Style Sheets
normal the effect of this keyword is dependent of the layout mode we are in: in absolutely-positioned layouts, the keyword behaves like start on replaced absolutely-positioned
boxes, and as stretch on all other absolutely-positioned
boxes.
... for grid items, this keyword leads to a behavior similar to the one of stretch, except for
boxes with an aspect ratio or an intrinsic sizes where it behaves like start.
... the property doesn't apply to block-level
boxes, and to table cells.
...And 2 more matches
Content Processes - Archive of obsolete content
sand
boxes were explained this article.
...since both add-on modules and content scripts are currently loaded in sand
boxes rather than separate processes, and sand
boxes can communicate with each other directly (using imports/exports), you might be wondering why we have to go through all the trouble of passing messages between add-on and content scripts.
... when two sand
boxes have the same privileges, a wrapper in one sandbox provides transparent access to an object in the other sandbox.
... when the two sand
boxes have different privileges, things become more complicated, however.
textbox (Toolkit autocomplete) - Archive of obsolete content
timeout type: integer for autocomplete text
boxes, the number of milliseconds before the textbox starts searching for completions.
...for search text
boxes, the number of milliseconds before the timer fires a command event.
...for timed text
boxes, the number of milliseconds before the timer fires a command event.
...for more information about autocomplete text
boxes, see the autocomplete documentation (xpfe [thunderbird/seamonkey]) (firefox) number a textbox that only allows the user to enter numbers.
Textbox (XPFE autocomplete) - Archive of obsolete content
timeout type: integer for autocomplete text
boxes, the number of milliseconds before the textbox starts searching for completions.
...for search text
boxes, the number of milliseconds before the timer fires a command event.
...for timed text
boxes, the number of milliseconds before the timer fires a command event.
...for more information about autocomplete text
boxes, see the autocomplete documentation (xpfe [thunderbird/seamonkey]) (firefox) number a textbox that only allows the user to enter numbers.
Adding more elements - Archive of obsolete content
« previousnext » we will conclude the discussion of
boxes by adding some
boxes to the find files dialog.
...me"/> <menuitem label="size"/> <menuitem label="date modified"/> </menupopup> </menulist> <spacer style="width: 10px;"/> <menulist id="searchmode"> <menupopup> <menuitem label="is"/> <menuitem label="is not"/> </menupopup> </menulist> <spacer style="width: 10px;"/> <textbox id="find-text" flex="1" style="min-width: 15em;"/> </hbox> two drop down
boxes have been added to the dialog.
...this is because they are inside horizontal
boxes.
...this is easy to do by adding a spacer in between the two horizontal
boxes.
Grids - Archive of obsolete content
you could add additional nested
boxes or even another grid inside a single cell.
... if you resize the window of the last example, you will see that the text
boxes resize, but no other elements do.
... this is because of the flex attributes added to the text
boxes and the second column.
... flexibility of grids one advantage that grids have over a set of nested
boxes is that you can create cells that are flexible both horizontally and vertically.
Using Spacers - Archive of obsolete content
we'll talk more about this in the next section but it essentially allows you to divide a window into a series of
boxes that hold elements.
... the
boxes will be positioned and resized based on specifications that you can define.
...before we get into detail about
boxes, we'll introduce another xul element that is useful for layout, the spacer.
...we'll look at
boxes in the next section.
3D collision detection - Game development
axis-aligned bounding
boxes as with 2d collision detection, axis-aligned bounding
boxes (aabb) are the quickest algorithm to determine whether the two game entities are overlapping or not.
... this consists of wrapping game entities in a non-rotated (thus axis-aligned) box and checking the positions of these
boxes in the 3d coordinate space to see if they are overlapping.
...the overlapping area between two non-rotated
boxes can be checked with logical comparisons alone, whereas rotated
boxes require additional trigonometric operations, which are slower to calculate.
...we just need to do one test per axis, using the
boxes' boundaries.
Handling different text directions - Learn web development
in this next example i have two
boxes that contain a heading and a paragraph.
... let's take a look at our two
boxes again — one with a horizontal-tb writing mode and one with vertical-rl.
... i have given both of these
boxes a width.
... if you change the writing mode of the
boxes by switching the writing-mode property on .box to vertical-rl, you will see how the physical properties stay tied to their physical direction, whereas the logical properties switch with the writing mode.
Overflowing content - Learn web development
you can constrain the size of these
boxes by assigning values of width and height (or inline-size and block-size).
...in addition, some of the methods discussed in sizing items in css may help you create
boxes that scale better with varying amounts of content.
...in the past, some sites were built with fixed-height containers to align bottoms of
boxes.
... these
boxes may otherwise have no relationship to each other.
Use CSS to solve common problems - Learn web development
ow to select elements via element name, class or id how to select elements via attribute name and content how to use pseudo-classes how to use pseudo-elements how to apply multiple selectors to the same rule how to specify colors in css how to debug css in the browser css and text how to style text how to customize a list of elements how to style links how to add shadows to text
boxes and layouts how to size css
boxes how to control overflowing content how to control the part of a css box that the background is drawn under how do i define inline, block, and inline-block?
... how to create fancy
boxes (also see the styling
boxes module, generally).
... how to change the box model completely using box-sizing how to control backgrounds how to control borders how to style an html table how to add shadows to
boxes uncommon and advanced techniques css allows some advanced design techniques.
... general how to calculate specificity of a css selector how to control inheritance in css advanced effects how to use filters in css how to use blend modes in css layout using css flexible
boxes using css multi-column layouts using css generated content ...
Components.utils.Sandbox
addons creating sand
boxes whose expected lifetime is tied to that of a content window object will want to use samezoneas instead.
...this helps to improve memory usage by allowing sand
boxes to be discarded when that zone goes away.
... the exception is "-promise": the promise constructor is available by default for sand
boxes, and you use this option to remove it from the sandbox.
...however, sand
boxes are often used when chrome wants to run script as another origin, possibly to interact with the page.
nsIMsgHeaderParser
inherits from: nsisupports last changed in gecko 1.9 (firefox 3) to create an instance, use: var msgheaderparser = components.classes["@mozilla.org/messenger/headerparser;1"] .createinstance(components.interfaces.nsimsgheaderparser); method overview string extractheaderaddressmail
boxes(in string line); void extractheaderaddressname(in string line, out string name); void extractheaderaddressnames(in string line, out string usernames); astring makefulladdress(in astring aname, in astring aaddress); string makefulladdressstring(in string aname, in string aaddress); wstring makefulladdresswstring(in wstring name, in wstring addr); obsol...
... wstring reformatunquotedaddresses(in wstring line); void removeduplicateaddresses(in string addrs, in string other_addrs, in prbool removealiasestome, out string newaddress); string unquotephraseoraddr(in string line, in boolean preserveintegrity); wstring unquotephraseoraddrwstring(in wstring line, in boolean preserveintegrity); methods extractheaderaddressmail
boxes() given a string which contains a list of header addresses, returns a comma-separated list of just the 'mailbox' portions.
... autf8string extractheaderaddressmail
boxes( in string line ); parameters line the header line to parse.
... exceptions thrown missing exception missing description native code only!parseheaderaddresses given a string which contains a list of header addresses, parses it into their component names and mail
boxes.
ARIA: listbox role - Accessibility
it is highly recommended to use the html select element, or a group of radio buttons if only one item can be selected, or a group of check
boxes if multiple items can be selected, because there is a lot of keyboard interactivity to manage focus for all the descendants, and native html elements provide this functionality for you for free.
...if list items are checkable, space can be used to toggle check
boxes.
... type-ahead is recommended for all list
boxes, especially those with more than seven options: type a character: focus moves to the next item with a name that starts with the typed character.
... example list
boxes with rearrangeable options: examples of both single-select and multi-select list
boxes with accompanying toolbars where options can be added, moved, and removed.
align-items - CSS: Cascading Style Sheets
baseline; /* overflow alignment (for positional alignment only) */ align-items: safe center; align-items: unsafe center; /* global values */ align-items: inherit; align-items: initial; align-items: unset; values normal the effect of this keyword is dependent of the layout mode we are in: in absolutely-positioned layouts, the keyword behaves like start on replaced absolutely-positioned
boxes, and as stretch on all other absolutely-positioned
boxes.
... for grid items, this keyword leads to a behavior similar to the one of stretch, except for
boxes with an aspect ratio or an intrinsic sizes where it behaves like start.
... the property doesn't apply to block-level
boxes, and to table cells.
... center the flex items' margin
boxes are centered within the line on the cross-axis.
<color> - CSS: Cascading Style Sheets
-moz-combobox background color for combo-
boxes.
... -moz-comboboxtext text color for combo-
boxes.
... -moz-dialog background color for dialog
boxes.
... -moz-dialogtext text color for dialog
boxes.
display - CSS: Cascading Style Sheets
inline the element generates one or more inline element
boxes that do not generate line breaks before or after themselves.
... ruby-base-container these elements behave like <rbc> html elements generated as anonymous
boxes.
... box <display-box> these values define whether an element generates display
boxes at all.
...they are replaced by their pseudo-box and their child
boxes.
justify-self - CSS: Cascading Style Sheets
in absolutely-positioned layouts, the keyword behaves like start on replaced absolutely-positioned
boxes, and as stretch on all other absolutely-positioned
boxes.
... in grid layouts, this keyword leads to a behavior similar to the one of stretch, except for
boxes with an aspect ratio or an intrinsic sizes where it behaves like start.
... baseline first baseline last baseline specifies participation in first- or last-baseline alignment: aligns the alignment baseline of the box’s first or last baseline set with the corresponding baseline in the shared first or last baseline set of all the
boxes in its baseline-sharing group.
... formal definition initial valueautoapplies toblock-level
boxes, absolutely-positioned
boxes, and grid itemsinheritednocomputed valueas specifiedanimation typediscrete formal syntax auto | normal | stretch | <baseline-position> | <overflow-position>?
<input>: The Input (Form Input) element - HTML: Hypertext Markup Language
(only the htmlinputelement’s checked idl attribute is updated.) note: unlike other input controls, a check
boxes and radio buttons value are only included in the submitted data if they are currently checked.
...the default value for check
boxes and radio buttons is on.
...(disabled controls, unchecked radio buttons, unchecked check
boxes, and reset buttons are also not sent.) there are two special cases: _charset_ : if used as the name of an <input> element of type hidden, the input's value is automatically set by the user agent to the character encoding being used to submit the form.
...this is especially useful (and even needed) for radio buttons and check
boxes, which are tiny.
core/namespace - Archive of obsolete content
let sand
boxes = ns(); function widget(options) { let { element, contentscript } = options; let widget = object.create(widget.prototype); view.call(widget, options.element); sand
boxes(widget).sandbox = cu.sandbox(element.ownerdocument.defaultview); // ...
... } widget.prototype = object.create(view.prototype); widget.prototype.postmessage = function postmessage(message) { let { sandbox } = sand
boxes(this); sandbox.postmessage(json.stringify(json.parse(message))); ...
... delete sand
boxes(this).sandbox; }; exports.widget = widget; in addition access to the namespace can be shared with other code by just handing them a namespace accessor function.
Appendix D: Loading Scripts - Archive of obsolete content
under ordinary circumstances, native objects passed out of sand
boxes are wrapped in xraywrapper objects, which means that only native properties of these objects are directly exposed to privileged code.
... disadvantages performance: there are several significant performance disadvantages inherent in this method: there is currently no way to load code into sand
boxes from a cache.
...chromebug supports firebug based sand
boxes.
align - Archive of obsolete content
for
boxes that have horizontal orientation, it specifies how its children will be aligned vertically.
... for
boxes that have vertical orientation, it specifies how its children will be aligned horizontally.
... baseline this value applies to horizontally oriented
boxes only.
timeout - Archive of obsolete content
« xul reference home timeout type: integer for autocomplete text
boxes, the number of milliseconds before the textbox starts searching for completions.
...for search text
boxes, the number of milliseconds before the timer fires a command event.
...for timed text
boxes, the number of milliseconds before the timer fires a command event.
Introduction to XBL - Archive of obsolete content
the basic appearance of all elements, such as scroll bars and check
boxes may be modified by adjusting the style or by setting attributes on the element.
...by assigning a class to a box tag, you can associate a binding to only those
boxes that belong to that class.
...the style sheet associated with the file says that
boxes with the class okcancelbuttons have a specialized binding, defined in the xbl file.
Stacks and Decks - Archive of obsolete content
there are a number of elements that are specialized types of
boxes, such as toolbars and tabbed panels.
...however, the specialized types of
boxes work just like regular
boxes in the way they orient the elements inside them, but they have additional features.
...they are all special types of
boxes and allow all of the attributes of
boxes on them.
Trees - Archive of obsolete content
however, list
boxes may contain any type of content, whereas trees may only contain text and images.
... (using advanced features, progress meters or check
boxes also can be added to the tree) a tree consists of two parts, the set of columns, and the tree body.
...as with list
boxes, a header row will appear with column labels.
XUL accessibility guidelines - Archive of obsolete content
for example, under the privacy section of preferences there are three group
boxes captioned: history, cookies, and private data.
... group
boxes are essential for radiogroups or groups of check
boxes with a similar theme (e.g.
...if you find nested group
boxes visually unappealing, use css to hide the border of the inner groupbox so that it can remain in the code to benefit users of assistive technologies.
XUL controls - Archive of obsolete content
<colorpicker type="button" color="#cc0080"/> colorpicker reference <datepicker> a set of text
boxes which may be used to allow the entry of a date.
... <datepicker type="grid" value="2007/02/20"/> datepicker reference <datepicker type="popup" > a datepicker which displays a set of text
boxes for date entry, but also has a button for displaying a popup calendar grid.
... <textbox type="timed"/> textbox reference <timepicker> a timepicker displays a set of text
boxes for entering a time.
attribute.align - Archive of obsolete content
for
boxes that have horizontal orientation, it specifies how its children will be aligned vertically.
... for
boxes that have vertical orientation, it is used to specify how its children are algined horizontally.
... baseline this value applies to horizontally oriented
boxes only.
richlistbox - Archive of obsolete content
note: in versions of firefox prior to firefox 3, rich list
boxes support only single selection.
... firefox 3 introduced multiple selection to rich list
boxes.
...this method does nothing for single-selection list
boxes.
Bounding volume collision detection with THREE.js - Game development
this article shows how to implement collision detection between bounding
boxes and spheres using the three.js library.
... instantiating
boxes to create a box3 instance, we need to provide the lower and upper boundaries of the box.
...box and sphere using boxhelper as an alternative to using raw box3 and sphere objects, three.js has a useful object to make handling bounding
boxes easier: boxhelper (previously boundingboxhelper, which has been deprecated).
Backgrounds and borders - Learn web development
prerequisites: basic computer literacy, basic software installed, basic knowledge of working with files, html basics (study introduction to html), and an idea of how css works (study css first steps.) objective: to learn how to style the background and border of
boxes.
...in the example below, we have two
boxes — one has a background image which is larger than the box, the other has a small image of a star.
...in the two
boxes respectively, we have a linear gradient that is stretched over the whole box, and a radial gradient with a set size, which therefore repeats.
Images, media, and form elements - Learn web development
images, other media, and form elements behave a little differently in terms of your ability to style them with css than regular
boxes.
... in the example below we have two
boxes, both 200 pixels in size: one contains an image which is smaller than 200 pixels — it is smaller than the box and doesn't stretch to fill it.
... styling text input elements elements that allow for text input, such as <input type="text">, specific types such as <input type="email">, and the <textarea> element are quite easy to style and tend to behave just like other
boxes on your page.
Floats - Learn web development
this is because a floated element is taken out of normal flow, and the
boxes of the following items actually run behind the float.
...ent montes, nascetur ridiculus mus.</p> body { width: 90%; max-width: 900px; margin: 0 auto; font: .9em/1.2 arial, helvetica, sans-serif } .box { float: left; margin: 15px; width: 150px; height: 150px; border-radius: 5px; background-color: rgb(207,232,220); padding: 1em; } .special { background-color: rgb(79,185,227); padding: 10px; color: #fff; } the line
boxes of our following element have been shortened so the text runs around the float, but due to the float being removed from normal flow the box around the paragraph still remains full width.
... clearing
boxes wrapped around a float you now know how to clear something following a floated element, but let's see what happens if you have a tall float and a short paragraph, with a box wrapped around both elements.
Introduction to CSS layout - Learn web development
the methods that can change how elements are laid out in css are as follows: the display property — standard values such as block, inline or inline-block can change how elements behave in normal flow, for example making a block-level element behave like an inline element (see types of css
boxes for more information).
... the position property — allows you to precisely control the placement of
boxes inside other
boxes.
...this is useful for creating complex layout effects such as tabbed
boxes where different content panels sit on top of one another and are shown and hidden as desired, or information panels that sit off screen by default, but can be made to slide on screen using a control button.
Multiple-column layout - Learn web development
in this case the content breaks when the spanning element is introduced and continues below creating a new set of column
boxes.
...in the live example below, i have used multicol to lay out a series of
boxes, each of which have a heading and some text inside.
... .card { break-inside: avoid; page-break-inside: avoid; background-color: rgb(207,232,220); border: 2px solid rgb(79,185,227); padding: 10px; margin: 0 0 1em 0; } reload the page and your
boxes should stay in one piece.
Supporting older browsers - Learn web development
prerequisites: html basics (study introduction to html), and an idea of how css works (study introduction to css and styling
boxes.) objective: to understand how to provide support for your layouts on older browsers that might not support the features you want to use.
...any browser that does not support css grid layout will see the row of
boxes as a floated layout.
...importantly, the anonymous
boxes created to fix up the table structure are not created.
CSS layout - Learn web development
at this point we've already looked at css fundamentals, how to style text, and how to style and manipulate the
boxes that your content sits inside.
... now it's time to look at how to place your
boxes in the right place in relation to the viewport, and one another.
... understand how to style
boxes.
CSS property compatibility table for form controls - Learn web development
border-radius no no box-shadow no no check
boxes and radio buttons see the checkbox and radio input types.
... border and background background no no border-radius no no box-shadow no no select
boxes (single line) see the <select>, <optgroup> and <option> elements.
... select
boxes (multiline) see the <select>, <optgroup> and <option> elements and the size attribute.
Experimental features in Firefox
html element: <dialog> the html <dialog> element and its associated dom apis provide support for html-based modal dialog
boxes.
... nightly 78 yes developer edition 78 yes beta 78 yes release 78 no preference name network.preload css display stray control characters in css as hex
boxes this feature renders control characters (unicode category cc) other than tab (u+0009), line feed (u+000a), form feed (u+000c), and carriage return (u+000d) as a hexbox when they are not expected.
... nightly 31 yes developer edition 31 no beta 31 no release 31 no preference name layout.css.getboxquads.enabled geometryutils method: getboxquads() the geometryutils method getboxquads() returns the css
boxes for a node relative to any other node or viewport.
Limitations of chrome scripts
sand
boxes you can create sand
boxes in the chrome or the content process.
... sand
boxes are often used as a safe way to manipulate web content, and if that's your goal, create the sandbox in the content process.
... there is a shim for sand
boxes: if you make a sandbox in the chrome process and give it content principals (by passing a cpow as the first argument to components.utils.sandbox) then we'll actually make it in the content process.
mozIRegistry
some are for illustrative purposes (the lighter-colored
boxes near the top of the picture).
...i'll talk about them to provide examples of how you should use the other
boxes.
... these components (indicated by the darker-colored
boxes) are the services you'll be using.
Settings - Firefox Developer Tools
to see the settings, open any of the developer tools, and then: click the "settings" command in the menu: or press f1 to toggle between the active tool and the settings pane the settings pane looks something like this: categories default firefox developer tools this group of check
boxes determines which tools are enabled in the toolbox.
... available toolbox buttons this group of check
boxes determines which tools get an icon in the toolbox's toolbar.
... enable browser chrome and add-on debugging tool
boxes enable you to use developer tools in the context of the browser itself, and not only web content.
Element.getBoundingClientRect() - Web APIs
syntax domrect = element.getboundingclientrect(); value the returned value is a domrect object which is the union of the rectangles returned by getclientrects() for the element, i.e., the css border-
boxes associated with the element.
... empty border-
boxes are completely ignored.
... if all the element's border-
boxes are empty, then a rectangle is returned with a width and height of zero and where the top and left are the top-left of the border-box for the first css box (in content order) for the element.
Intersection Observer API - Web APIs
it uses a vendor-provided library to manage the advertisements placed periodically throughout the page, has animated graphics here and there, and uses a custom library that draws notification
boxes and the like.
...; } .topright { right: 2px; top: 2px; } .bottomleft { bottom: 2px; left: 2px; } .bottomright { bottom: 2px; right: 2px; } let observers = []; startup = () => { let wrapper = document.queryselector(".wrapper"); // options for the observers let observeroptions = { root: null, rootmargin: "0px", threshold: [] }; // an array of threshold sets for each of the
boxes.
... the target element's bounding rectangle (that is, the smallest rectangle that fully encloses the bounding
boxes of every component that makes up the element) is obtained by calling getboundingclientrect() on the target.
ARIA Test Cases - Accessibility
the state of tristate check
boxes is not announced when initially focusing.
...role may or may not be spoken, screen reader should use same handling as for regular group
boxes.
...if it also contains content, an indication should be given as for regular text
boxes.
Basic Concepts of Multicol - CSS: Cascading Style Sheets
multiple-column layout, usually referred to as multicol, is a specification for laying out content into a set of column
boxes much like columns in a newspaper.
...the columns are anonymous
boxes and described as column
boxes in the specification.
...therefore, the column width should be seen as a minimum width, as column
boxes are likely to be wider due to the additional space.
Backwards Compatibility of Flexbox - CSS: Cascading Style Sheets
css creates anonymous
boxes to represent these items so that you do not need to wrap each item in a wrapper to represent the html table row, and a second one to represent the table element itself, you can’t see or style these anonymous
boxes; they are there purely to fix up the tree.
... if you then declare display: flex on the parent item, these anonymous
boxes do not get created and so your item remains a direct child and can become a flex item — losing any of the table display features.
... “note: some values of display normally trigger the creation of anonymous
boxes around the original box.
Controlling Ratios of Flex Items Along the Main Axis - CSS: Cascading Style Sheets
in this example i have created a series of inflexible
boxes, with both flex-grow and flex-shrink set to 0.
... so where flex-grow deals with adding available space, flex-shrink manages taking away space to make
boxes fit into their container without overflowing.
...you don’t usually want your content to disappear completely or for
boxes to get smaller than their minimum content, so the above rules make sense in terms of sensible behaviour for content that needs to be shrunk in order to fit into a container.
Relationship of grid layout to other layout methods - CSS: Cascading Style Sheets
in this first example, i am using flexbox to lay out a set of
boxes.
...the contents value of the display property is a new value that is described in the display specification as follows: “the element itself does not generate any
boxes, but its children and pseudo-elements still generate
boxes as normal.
... for the purposes of box generation and layout, the element must be treated as if it had been replaced with its children and pseudo-elements in the document tree.” if you set an item to display: contents the box it would normally create disappears, and the
boxes of the child elements appear as if they have risen up a level.
Understanding CSS z-index - CSS: Cascading Style Sheets
in addition to their horizontal and vertical positions,
boxes lie along a "z-axis" and are formatted one on top of the other.
... z-axis positions are particularly relevant when
boxes overlap visually.
... (from css 2.1 section 9.9.1 - layered presentation) this means that css style rules allow you to position
boxes on layers in addition to the normal rendering layer (layer 0).
Basic Shapes - CSS: Cascading Style Sheets
the floated element has 20 pixels of padding, border and margin applied, and the shapes inspector highlights these reference
boxes.
... for an excellent description of references
boxes as they apply to css shapes see understanding reference
boxes for css shapes.
... the shape will be clipped by the margin box when describing reference
boxes i explained that the margin-box will clip the shape.
box-lines - CSS: Cascading Style Sheets
the box-lines css property determines whether the box may have a single or multiple lines (rows for horizontally oriented
boxes, columns for vertically oriented
boxes).
...the later lines are placed below the earlier lines in normal direction
boxes and above in reverse direction
boxes.
...later lines in normal direction
boxes are placed to the right of earlier lines and to the left in reverse direction
boxes.
justify-items - CSS: Cascading Style Sheets
in absolutely-positioned layouts, the keyword behaved like start on replaced absolutely-positioned
boxes, and as stretch on all other absolutely-positioned
boxes.
... in grid layouts, this keyword leads to a behavior similar to the one of stretch, except for
boxes with an aspect ratio or an intrinsic sizes where it behaves like start.
... baseline first baseline last baseline specifies participation in first- or last-baseline alignment: aligns the alignment baseline of the box’s first or last baseline set with the corresponding baseline in the shared first or last baseline set of all the
boxes in its baseline-sharing group.
max-block-size - CSS: Cascading Style Sheets
everything else about the two
boxes is identical, including the values used for max-block-size.
...both
boxes share the standard-box class, which simply establishes coloring, padding, and their respective values of max-block-size.
...the first, standard-box, is applied to both
boxes, as seen above.
place-items - CSS: Cascading Style Sheets
in absolutely-positioned layouts, the keyword behaved like start on replaced absolutely-positioned
boxes, and as stretch on all other absolutely-positioned
boxes.
... in grid layouts, this keyword leads to a behavior similar to the one of stretch, except for
boxes with an aspect ratio or an intrinsic sizes where it behaves like start.
... baseline first baseline last baseline specifies participation in first- or last-baseline alignment: aligns the alignment baseline of the box’s first or last baseline set with the corresponding baseline in the shared first or last baseline set of all the
boxes in its baseline-sharing group.
white-space - CSS: Cascading Style Sheets
lines are broken as necessary to fill line
boxes.
...lines are broken at newline characters, at <br>, and as necessary to fill line
boxes.
...lines are broken at newline characters, at <br>, and as necessary to fill line
boxes.
Applying color to HTML elements using CSS - HTML: Hypertext Markup Language
boxes every element is a box with some sort of content, and has a background and a border in addition to whatever contents the box may have.
... our two colored
boxes share a number of properties in common, so next we establish a class, .box, that defines those shared properties: .box { width: 290px; height: 100px; margin: 0; padding: 4px 6px; font: 28px "marker felt", "zapfino", cursive; display: flex; justify-content: center; align-items: center; } in brief, .box establishes the size of each box, as well as the configuration of the font use...
...then we can create a class for each of the two
boxes that defines the properties that differ between the two.
<input type="radio"> - HTML: Hypertext Markup Language
note: check
boxes are similar to radio buttons, but with an important distinction: radio buttons are designed for selecting one value out of a set, whereas check
boxes let you turn individual values on and off.
... where multiple controls exist, radio buttons allow one to be selected out of them all, whereas check
boxes allow multiple values to be selected.
...by default, radio buttons (and check
boxes) are styled with the operating system's native styles for those controls.
Examples and demos from articles - Archive of obsolete content
.[article] pure-css web gallery based on the :checked pseudoclass [zip] you can also use the :checked pseudo-class applied to hidden radio
boxes in order to build, for example, an image gallery with full-size images shown only when mouse clicks on previews.
...[article] pure-css editable (pseudo)<select> [html] this example shows how it's possible to simulate an editable <select> through a fieldset of radio
boxes and text
boxes.
Code snippets - Archive of obsolete content
xml file i/o code used to read, write and process files drag & drop code used to setup and handle drag and drop events dialogs code used to display and process dialog
boxes alerts and notifications modal and non-modal ways to notify users preferences code used to read, write, and modify preferences js xpcom code used to define and call xpcom components in javascript running applications code used to run other applications <canvas> related what wg canvas-related code signing a xpi how to sign an xpi with pki delayed execution performing background oper...
... autocomplete code used to enable form autocomplete in a browser
boxes tips and tricks when using
boxes as containers tabbox removing and manipulating tabs in a tabbox windows-specific finding window handles (hwnd) (firefox) how to use windows api calls to find various kinds of mozilla window handles.
Adding windows and dialogs - Archive of obsolete content
the prompt service has a very rich set of functions that allow different kinds of inputs, such as text, passwords, usernames and passwords, and check
boxes that can be used for "never ask this again"-type dialogs.
... group
boxes the groupbox element should be easy to understand: it groups a series of xul controls together.
pack - Archive of obsolete content
for
boxes with horizontal orientation, it is used to indicate the position of children horizontally.
... for
boxes with vertical orientation, it is used to indicate the position of children vertically.
treecol.type - Archive of obsolete content
checkbox the content of the columns are check
boxes.
...here is an example css style using the current theme's check
boxes: treechildren::-moz-tree-checkbox { /* unchecked checkbox treecells.
Box Objects - Archive of obsolete content
recall that all xul elements are types of
boxes, that is the box is the base of all displayed xul elements.
...this attribute was explained earlier in the section on
boxes.
Manipulating Lists - Archive of obsolete content
although list
boxes may be manipulated using the standard dom functions as well, it is recommended that the specialized listbox functions be used instead when possible.
...').value; val = number(val); if (val != null) document.getelementbyid('level').selectedindex = val - 1; } </script> <hbox align="center"> <label value="enter a number from 1 to 3:"/> <textbox id="number"/> <button label="select" oncommand="doselect();"/> </hbox> <radiogroup id="level"> <radio label="excellent"/> <radio label="good"/> <radio label="poor"/> </radiogroup> list
boxes also support multiple selection and the functions of the nsidomxulmultiselectcontrolelement interface.
Modifying a XUL Interface - Archive of obsolete content
manipulating basic elements the main xul elements such as buttons, check
boxes and radio buttons may be manipulated using a number of script properties.
...you can also retrieve the current label or value using these properties, as in the following example: example 5 : source view <button label="hello" oncommand="alert(this.label);"/> toggling a checkbox check
boxes have a checked property which may be used to check or uncheck the checkbox.
Numeric Controls - Archive of obsolete content
as with other text
boxes, the default value can be specified with the value attribute.
...when used, they display a set of numeric text
boxes to enter each of the components of the date or time.
XUL Structure - Archive of obsolete content
you will commonly use this feature in more complex xul applications since you wouldn't want the browser ui to exist around your dialog
boxes.
...it also defines the default appearance and functionality of the various common xul widgets such as text
boxes and buttons.
scale - Archive of obsolete content
increment type: integer the amount by which the curpos (for scroll bars) or value (for number
boxes and scale) attribute changes when the arrows are clicked(or scales are dragged).
...the default value is 100 for scales and infinity for number
boxes.
titlebar - Archive of obsolete content
« xul reference home [ examples | attributes | properties | methods | related ]
boxes created with the titlebar element behave just like a normal window titlebar: when the element is clicked and dragged, the window moves with it.
...buttons inside it can't be clicked and text
boxes can't be focused with the mouse.
2006-10-20 - Archive of obsolete content
comet and btek are currently the fastest-cycling tinder
boxes available therefore they are quite fast to detect general fires on the mozilla tree.
...boris zbarsky's said: the reason why gtk1 builds are still being performed is because: when requests are made to change build
boxes to newer versions the people responsible for making the change reply with "that would require an os upgrade".
2006-11-03 - Archive of obsolete content
paul reed announced that: that he is taking down old tinder
boxes and making a few changes to existing tinder
boxes.
... on october 30th boris zbarsky boris expresses his opinion about paul taking down one of the two build
boxes that produces nightly builds for linux.
2006-10-20 - Archive of obsolete content
discussions sparky and comet going away on friday preed wants to get rid of sparky and comet (both older desktop class linux
boxes).
... robert kaiser gave some background on the
boxes.
Theme changes in Firefox 3.5 - Archive of obsolete content
global/checkbox.css, global/radio.css since bug 394892, radio buttons and check
boxes no longer have a minimum size on mac os x.
... if your theme uses native check
boxes or radiobuttons (-moz-appearance: radio / checkbox), this can result in distorted controls.
display-outside - Archive of obsolete content
none the element generates no
boxes, and does not participate in any formatting context.
...for example, a table-row box requires its parent to be a table row group box and its children to be table-cell
boxes.
Styling the Amazing Netscape Fish Cam Page - Archive of obsolete content
since i wanted them to be side by side, it was important to be sure the total width of the element
boxes (including margins) was less than 50%, so the first step was this: div.card {float: left; width: 45%; margin: 1em 2% 0 2%;} by making the content of each card 45% the width of the containing element, and adding 2% margin to both the left and right sides, each card's element box is 49% as wide as the parent.
...i did it that way because it's a lot less likely to trigger a situation where rounding errors force the two floats to total more than 100% the width of the parent, as could happen if the floats' element
boxes were made to total 50%.
Index - Game development
13 3d collision detection 3d, games, javascript, bounding
boxes, collision detection this article provides an introduction to the different bounding volume techniques used to implement collision detection in 3d environments.
... 14 bounding volume collision detection with three.js 3d, games, javascript, webgl, bounding
boxes, collision detection, three.js this article shows how to implement collision detection between bounding
boxes and spheres using the three.js library.
Debugging CSS - Learn web development
you can toggle values in the rules view on and off, when that panel is active — if you hold your mouse over it check
boxes will appear.
... compare the two
boxes with classes box1 and box2.
CSS building blocks - Learn web development
the sub-articles are as follows: type, class, and id selectors attribute selectors pseudo-classes and pseudo-elements combinators the box model everything in css has a box around it, and understanding these
boxes is key to being able to create layouts with css, or to align items with other items.
...images, other media, and form elements behave a little differently in terms of your ability to style them with css than regular
boxes.
Grids - Learn web development
prerequisites: html basics (study introduction to html), and an idea of how css works (study introduction to css and styling
boxes.) objective: to understand the fundamental concepts behind grid layout systems, and how to implement a grid layout using css grid.
...by default these display in normal flow so the
boxes display one below the other.
Positioning - Learn web development
what if you want to slightly alter the position of some
boxes inside a layout from their default layout flow position, to give a slightly quirky, distressed feel?
... for example, popup information
boxes and control menus; rollover panels; ui features that can be dragged and dropped anywhere on the page; and so on...
Learn to style HTML using CSS - Learn web development
css layout at this point we've already looked at css fundamentals, how to style text, and how to style and manipulate the
boxes that your content sits inside.
... now it's time to look at how to place your
boxes in the right place in relation to the viewport, and one another.
How to structure a web form - Learn web development
this is useful for controls like text inputs, where you can click the label as well as the input to focus it, but it is especially useful for radio buttons and check
boxes — the hit area of such a control can be very small, so it is useful to make it as easy to activate as possible.
...lists are recommended for structuring multiple check
boxes or radio buttons.
CSS basics - Learn web development
your work-in-progress should look similar to this: css: all about
boxes something you'll notice about writing css: a lot of it is about
boxes.
...most html elements on your page can be thought of as
boxes sitting on top of other
boxes.
Componentizing our React app - Learn web development
once you’re done, the todo component's <input /> element will read like this: <input id="todo-0" type="checkbox" defaultchecked={props.completed} /> and your browser should update to show only eat being checked: if you change each <todo /> component’s completed prop, your browser will check or uncheck the equivalent rendered check
boxes accordingly.
...we’re missing our html structure — the <li> and its check
boxes and buttons!
Componentizing our Svelte app - Learn web development
some people prefer an intuitive approach and start looking at the markup and drawing
boxes around every component and subcomponent that seems to have its own logic.
... update the {#each} block inside todos.svelte like so: <ul role="list" class="todo-list stack-large" aria-labelledby="list-heading"> {#each filtertodos(filter, todos) as todo (todo.id)} <li class="todo"> <todo {todo} /> </li> {:else} <li>nothing to do here!</li> {/each} </ul> the list of todos is displayed on the page, and the check
boxes should work (try checking/unchecking a couple, and then observing that the filters still work as expected), but our "x out of y items completed" status heading will no longer update accordingly.
Creating our first Vue component - Learn web development
however, we're currently not doing anything with the "done" prop — we can check the check
boxes in the ui, but nowhere in the app are we recording whether a todo item is actually done.
...this would result in errors with assistive technology since the id is needed to correctly map labels to their check
boxes.
Strategies for carrying out testing - Learn web development
follow the instructions and fill in the following dialog
boxes as appropriate.
... you'll: provide a name for the new virtual machine choose which operating system and version you are installing on it set how much ram should be allocated (we'd recommend something like 2048mb, or 2gb) create a virtual hard disk (choose the default options across the three dialog
boxes containing create a virtual hard disk now, vdi (virtual disk image), and dynamically allocated).
Mozilla’s UAAG evaluation report
(p1) c status line and alert
boxes used to convey messages and alerts guideline 2.
...(p1) vg mozilla implements standard keyboard bindings there are a few missing pieces, such as support in xul combo
boxes (menulist) for selecting items by typing alphanumeric keystrokes 7.3 operating environment conventions.
The Firefox codebase: CSS Guidelines
in general, the following colors are used: -moz-field: textbox or field background colors, also used as the background color of list
boxes or trees.
... -moz-fieldtext: textbox or field text colors, also used as the text color of list
boxes or trees.
Embedding Tips
normally it provide some functionality that is required from lots of places such as looking up preference settings, creating new windows, locating files, displaying prompt or password dialog
boxes and so on.
... how do i display my own message, alert and prompt
boxes?
Script security
normal content windows are globals, of course, but so are chrome windows, sand
boxes, workers, the contentframemessagemanager in a frame script, and so on.
...the add-on sdk runs content scripts in sand
boxes, which are initialized with an expanded principal, giving them elevated privileges with respect to the web content they operate on, but reduced privileges with respect to chrome.
Gecko's "Almost Standards" Mode
"almost standards" rendering mode is exactly the same as "standards" mode in all details save one, where it works like "quirks" mode: the height calculations for line
boxes and some of the inline elements in them.
...(see the devedge article "images, tables, and mysterious gaps" for a detailed explanation of how such layouts are treated in "standards" mode.) in slightly more detail, what differs in almost-standards mode is roughly this: inline
boxes that have no non-whitespace text as a child and have no border, padding, or margin: do not influence the size of the line box (that is, their line-height is ignored) do not get a height (e.g., for their background) larger than that of their descendants, even if their font size is larger (if they have no descendants, they are zero-height positioned at their baseline) other than this one diff...
NSPR release process
make sure the nss tinder
boxes (which also build and test nspr) are all green.
... the build+test cycles of the nss tinder
boxes are very long, so you usually need to wait half a day for them to cycle through.
Index
174 iaccessiblevalue interfaces, xpcom, xpcom interface reference the iaccessiblevalue interface represents a single numerical value and should be implemented by any class that supports numerical value like progress bars and spin
boxes.
... 1227 nsxpidlcstring class declaration 1228 nsxpidlstring class declaration 1229 xpcom primitive xpcom, xpcom api reference an xpcom primitive is an xpcom object that "
boxes" a value of a primitive type.
nsIAccessibleProvider
xformsselectfull 0x00002011 used for xforms full select/select1 elements that may be represented by group of check
boxes and radiogroup.
... xformsitemcheckgroup 0x00002012 used for xforms item element that is used inside xforms select elements represented by group of check
boxes.
XUL Overlays
the layout engine loads any overlay files and then flows the resulting xul document, so problems associated with incremental insertion in menus,
boxes, tables, and forms are avoided.
...toolbars, submenus,
boxes, and any other subtrees that appear in multiple places can be defined in overlays files in this way and referenced for reuse wherever necessary.
Main Windows
msghdrviewoverlay.xul shown in blue above (where?), this overlay consists of three
boxes.
... msghdrviewoverlay.xul shown in blue above, this overlay consists of three
boxes.
Tutorial: Set a breakpoint - Firefox Developer Tools
to do this, open the firefox developer tools, click on the options gear at the upper right of the toolbox, and make sure that both “enable browser chrome and add-on debugging tool
boxes” and “enable remote debugging” are checked.
...if that item doesn’t appear in the “web developer” menu, make sure you checked both
boxes to enable the browser content toolbox as explained in step 1.
DevTools API - Firefox Developer Tools
api gdevtools the gdevtools api can be used to register new tools, themes and handle tool
boxes for different tabs and windows.
... unregistertool(tool) unregisters the given tool and removes it from all tool
boxes.
Element.getClientRects() - Web APIs
rectangles are returned even for css
boxes that have empty border-
boxes.
...note that the p has onlyone border box, while the span has multiple border
boxes.</p> <div> <strong>original</strong> <p> <span>paragraph that spans multiple lines</span> </p> </div> <div> <strong>p's rect</strong> <p class="withclientrectsoverlay"> <span>paragraph that spans multiple lines</span> </p> </div> <div> <strong>span's rect</strong> <p> <span class="withclientrectsoverlay">paragraph that spans multiple lines</span> </p> </div> exam...
ResizeObserverEntry.borderBoxSize - Web APIs
for
boxes with a horizontal writing-mode, this is the vertical dimension, or height; if the writing-mode is vertical, this is the horizontal dimension, or width.
...for
boxes with a horizontal writing-mode, this is the horizontal dimension, or width; if the writing-mode is vertical, this is the vertical dimension, or height.
ResizeObserverEntry.contentBoxSize - Web APIs
for
boxes with a horizontal writing-mode, this is the vertical dimension, or height; if the writing-mode is vertical, this is the horizontal dimension, or width.
...for
boxes with a horizontal writing-mode, this is the horizontal dimension, or width; if the writing-mode is vertical, this is the vertical dimension, or height.
Storage API - Web APIs
"persistent" the user agent will retain the data as long as possible, clearing all "best-effort"
boxes before considering clearing a box marked "persistent".
... if it becomes necessary to consider clearing persistent
boxes, the user agent will notify the user and provide a way to clear one or more persistent
boxes as needed.
Window.confirm() - Web APIs
example if (window.confirm("do you really want to leave?")) { window.open("exit.html", "thanks for visiting!"); } produces: notes the following text is shared between this article, dom:window.prompt and dom:window.alert dialog
boxes are modal windows — they prevent the user from accessing the rest of the program's interface until the dialog box is closed.
...regardless, there are good reasons to avoid using dialog
boxes for confirmation.
-moz-image-rect - CSS: Cascading Style Sheets
css the css defines one container style, then the styles for the four
boxes that comprise the complete image.
... the container looks like this: #container { width:267px; height:272px; top:100px; left:100px; position:absolute; font-size:16px; text-shadow:white 0px 0px 6px; text-align:center; } then the four
boxes defining the segments of the image are defined.
Handling Overflow in Multicol - CSS: Cascading Style Sheets
in this guide we look at how multicol deals with overflow, both inside the column
boxes and in situations where there is more content than will fit into the container.
... overflow inside column
boxes an overflow situation happens when an item's size is larger than the column box.
Flow Layout and Writing Modes - CSS: Cascading Style Sheets
the block flow direction is the direction in which
boxes, for example paragraphs, stack in that writing mode.
...
boxes with a different writing mode to their parent when a nested box is assigned a different writing mode to its parent, then an inline level box will display as if it has display: inline-block.
In Flow and Out of Flow - CSS: Cascading Style Sheets
you can see the background colour of the following paragraph running underneath, it is only the line
boxes of that paragraph that have been shortened to cause the effect of wrapping content around the float.
...this is why, to make space around a floated item, you must add a margin to the item, in order to push the line
boxes away from it.
Overview of CSS Shapes - CSS: Cascading Style Sheets
the specification defines four <basic-shape> values, which are: inset() circle() ellipse() polygon() using the value inset() wraps text around a rectangular shape however you are able to add offset values, thus pulling the line
boxes of any wrapping content closer to the object than would otherwise happen.
...this will further shorten the line
boxes of any content wrapping the shape, pushing it away from the shape itself.
Layout mode - CSS: Cascading Style Sheets
a css layout mode, sometimes simply called layout, is an algorithm that determines the position and size of
boxes based on the way they interact with their sibling and ancestor
boxes.
...normal flow includes block layout, designed for laying out
boxes such as paragraphs and inline layout, which lays out inline items such as text.
CSS Tutorials - CSS: Cascading Style Sheets
understanding z-index controlling superposition of
boxes is a basic feature that is very quickly needed by web developers.
... css flexible
boxes layouts this new layout allow you to give
boxes flexibility, allowing them to be resized smoothly.
justify-content - CSS: Cascading Style Sheets
baseline first baseline last baseline specifies participation in first- or last-baseline alignment: aligns the alignment baseline of the box’s first or last baseline set with the corresponding baseline in the shared first or last baseline set of all the
boxes in its baseline-sharing group.
... note: stretch is not supported by flexible
boxes (flexbox).
margin-trim - CSS: Cascading Style Sheets
in-flow for in-flow
boxes contained by this box, block-axis margins adjacent to the box's edges are truncated to zero.
... all trims the margins of in-flow
boxes and floats whose margins coincide with the container's content edge.
mask-origin - CSS: Cascading Style Sheets
for elements rendered as multiple
boxes, such as inline
boxes on several lines or
boxes on several pages, it specifies which
boxes box-decoration-break operates upon to determine the mask positioning area.
...for single
boxes 0 0 is the upper left corner of the padding edge, 100% 100% is the lower right corner.
scrollbar-width - CSS: Cascading Style Sheets
initial valueautoapplies toscrolling
boxesinheritednocomputed valueas specifiedanimation typediscrete syntax /* keyword values */ scrollbar-width: auto; scrollbar-width: thin; scrollbar-width: none; /* global values */ scrollbar-width: inherit; scrollbar-width: initial; scrollbar-width: unset; values <scrollbar-width> defines the width of the scrollbar as a keyword.
... mdn understanding wcag, guideline 2.1 explanations mdn understanding wcag, guideline 2.5 explanations understanding success criterion 2.1.1 | w3c understanding wcag 2.1 understanding success criterion 2.5.5 | w3c understanding wcag 2.1 formal definition initial valueautoapplies toscrolling
boxesinheritednocomputed valueas specifiedanimation typediscrete formal syntax auto | thin | none examples sizing overflow scrollbars css .scroller { width: 300px; height: 100px; overflow-y: scroll; scrollbar-width: thin; } html <div class="scroller">veggies es bonus vobis, proinde vos postulo essum magis kohlrabi welsh onion daikon amaranth tatsoi tomatillo melon azuki bean garlic.
CSS: Cascading Style Sheets
css layout at this point we've already looked at css fundamentals, how to style text, and how to style and manipulate the
boxes that your content sits inside.
... now it's time to look at how to place your
boxes in the right place concerning the viewport, and one another.
HTML attribute: readonly - HTML: Hypertext Markup Language
note: only text controls can be made read-only, since for other controls (such as check
boxes and buttons) there is no useful distinction between being read-only and being disabled, so the readonly attribute does not apply.
...bel> </div> <div class="group"> <input type="email" value="some value" readonly="readonly"/> <label>email</label> </div> <div class="group"> <input type="password" value="some value" readonly="readonly"/> <label>password</label> </div> <div class="group"> <textarea readonly="readonly">some value</textarea> <label>message</label> </div> result examples <fieldset> <legend>check
boxes buttons</legend> <p><label> <input type="checkbox" name="chbox" value="regular"> regular </label></p> <p><label> <input type="checkbox" name="chbox" value="readonly" readonly> readonly </label></p> <p><label> <input type="checkbox" name="chbox" value="disabled" disabled> disabled </label></p> </fieldset> <fieldset> <legend>radio buttons</legend> <p><label> <input t...
Tutorials
intermediate level css layout at this point we've already looked at css fundamentals, how to style text, and how to style and manipulate the
boxes that your content sits inside.
... now it's time to look at how to place your
boxes in the right place in relation to the viewport, and one another.
Guides - Archive of obsolete content
modules learn about the module system used by the sdk (which is based on the commonjs specification), how sand
boxes and compartments can be used to improve security, and about the built-in sdk module loader, known as cuddlefish.
/loader - Archive of obsolete content
load() the load() function takes loader and loads the given module into it: let loader = loader(options); let module = module('foo/bar', 'resource:///modules/foo/bar.js'); load(loader, module); sandbox() the sandbox() function is a utility function for creating js sand
boxes.
core/promise - Archive of obsolete content
instead of structuring our programs into logical black
boxes: function blackbox(a, b) { var c = assemble(a); return combine(b, c); } we're forced into continuation passing style, involving lots of machinery: function sphagetti(a, b, callback) { assemble(a, function continuewith(error, c) { if (error) callback(error); else combine(b, c, callback); }); } this style also makes doing things in sequence hard: widget.on('click', function onclick() { promptuserfortwitterhandle(function continuewith(error, handle) { if (error) return ui.displayerro...
Index of archived content - Archive of obsolete content
open a web page troubleshooting unit testing using xpcom without chrome using third-party modules (jpm) bootstrapped extensions code snippets alerts and notifications autocomplete bookmarks
boxes canvas code snippets cookies customizing the download progress bar delayed execution dialogs and prompts downloading files drag & drop embedding svg examples and demos from articles file i/o finding window handles forms related code snippets h...
Extenders - Archive of obsolete content
manifest chief mechanism for allowing advanced api use within your jetpack superpowers similar to libraries, superpowers are for adding deeper platform coupling for your jetpack sand
boxes safely abstracts library interoperability issues so you don't have to worry about them future api interface method for including not yet finalized functionality in your jetpack ...
Mozilla Application Framework in Detail - Archive of obsolete content
open source and freely available, gecko is small in size and modular and achieves rendering speed superior to all other browser engines - which makes it perfect for embedding into both desktop applications such as browsers and new devices such as browsing appliances and set top
boxes.
Using XPInstall to Install Plugins - Archive of obsolete content
the smartupdate download was triggered via the pluginurl attribute of the embed tag: <embed type="application/x-randomtype" src="myfile.typ" width="50" height="50" pluginurl="http://mytypecompany.xyz/jarpacks/mytypeplugin.jar"></embed> in the example above, the pluginurl attribute points to the signed jar file, which netscape communicator 4.x would then download (subject to the security dialog
boxes) if the plugin was not located on the user's machine.
increment - Archive of obsolete content
« xul reference home increment type: integer the amount by which the curpos (for scroll bars) or value (for number
boxes and scale) attribute changes when the arrows are clicked(or scales are dragged).
textbox.type - Archive of obsolete content
for more information about autocomplete text
boxes, see the autocomplete documentation (xpfe [thunderbird/seamonkey]) (firefox) number a textbox that only allows the user to enter numbers.
Deprecated and defunct markup - Archive of obsolete content
ld/experimental and unsupported xul tags) <treeindentation> (old/experimental and unsupported xul tags) was a part of the old <tree> that predated <outliner> that was not converted to <listbox>--neil 03 march 2011 <treeicon> (old/experimental and unsupported xul tags) <treerows> (internal use only; part of xbl for <tree>) attributes @debug="true" provided struts and springs around
boxes to facilitate identification of flex issues but does not seem to work now you need a special debug_layout build --neil 03 march 2011 references xul element reference by neal deakin rapid application development with mozilla, by nigel mcfarlane ...
Namespaces - Archive of obsolete content
the xul and foobar namespaces must be defined at the top of the xml document in which they are used, like so: <foobar:some-element xmlns:xul="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul" xmlns:foobar="the-foobar-namespace"> <xul:textbox id="foo" value="bar"/> <foobar:textbox favorite-food="pancakes"/> </foobar:some-element> notice i've mixed two <text
boxes/> in the same document.
Introduction - Archive of obsolete content
some elements that can be created are: input controls such as text
boxes and check
boxes toolbars with buttons or other content menus on a menu bar or pop up menus tabbed dialogs trees for hierarchical or tabular information keyboard shortcuts the displayed content can be created from the contents of a xul file or with data from a datasource.
Tree Box Objects - Archive of obsolete content
ee.boxobject.queryinterface(components.interfaces.nsitreeboxobject) as shown in the code examples on this page because: let boxobject = tree.treeboxobject; note: is equivalent to: let boxobject = tree.boxobject; boxobject.queryinterface("components.interfaces.nsitreeboxobject"); scrolling the tree you can also scroll the tree using four different methods, similar to those available for list
boxes.
XUL Tutorial - Archive of obsolete content
introduction introduction xul structure the chrome url manifest files simple elements creating a window adding buttons adding labels and images input controls numeric controls list controls progress meters adding html elements using spacers more button features the box model the box model element positioning box model details group
boxes adding more elements more layout elements stacks and decks stack positioning tab
boxes grids content panels splitters toolbars and menus toolbars simple menu bars more menu features popup menus scrolling menus events and scripts adding event handlers more event handlers keyboard shortcuts focus and selection commands updating commands broadcasters and observers doc...
dialog - Archive of obsolete content
« xul reference home [ examples | attributes | properties | methods | related ] this element should be used in place of the window element for dialog
boxes.
label - Archive of obsolete content
the caption is in the "value" attribute remember that the label element has a "value" attribute, unlike value in html whereas buttons, check
boxes use label="foo" as the attribute <label label="a caption"/> <!-- wrong --> <label value="a caption"/> <label value="click the button"/> <button label="a button"/> <checkbox label="a decision" value="1"/> wrapping by default, label text does not wrap.
scrollbar - Archive of obsolete content
increment type: integer the amount by which the curpos (for scroll bars) or value (for number
boxes and scale) attribute changes when the arrows are clicked(or scales are dragged).
NPAPI plugin developer guide - Archive of obsolete content
-ins printing the plug-in setting the window getting information windowed plug-ins mac os windows unix event handling for windowed plug-ins windowless plug-ins specifying that a plug-in is windowless invalidating the drawing area forcing a paint message making a plug-in opaque making a plug-in transparent creating pop-up menus and dialog
boxes event handling for windowless plug-ins streams receiving a stream telling the plug-in when a stream is created telling the plug-in when a stream is deleted finding out how much data the plug-in can accept writing the stream to the plug-in sending the stream in random-access mode sending the stream in file mode sending a stream creating a stream pushing data into the stream ...
Monitoring plugins - Archive of obsolete content
serve: function(subject, topic, data) { if (topic == "experimental-notify-plugin-call" ) { if (data > 0.500) { alert("runtime is: " + data); } } } note: this is just a simplified example and the use of alert() is discouraged as the component can send hundreds of notifications each second and could potentially cause your browser to crash if an excessive number of alert
boxes are displayed.
NPP_Print - Archive of obsolete content
an embedded plug-in shares printing with the browser; the plug-in prints the part of the page it occupies, and the browser handles everything else, including displaying print dialog
boxes, getting the printer device context, and any other tasks involved in printing, as well as printing the rest of the page.
Common Firefox theme issues and solutions - Archive of obsolete content
z-image-region: rect(0, 32px, 16px, 16px); } #identity-box:hover:active > #identity-box-inner > #page-proxy-stack > #page-proxy-favicon, #identity-box[open=true] > #identity-box-inner > #page-proxy-stack > #page-proxy-favicon { -moz-image-region: rect(0, 48px, 16px, 32px); } #page-proxy-favicon[pageproxystate="invalid"] { opacity: 0.5; } for more information about identity
boxes please see the identity box section of the amo editors theme review guidelines no visual clue for disabled url bars there needs to be a visual clue when url bar is disabled.
::-ms-check - Archive of obsolete content
the ::-ms-check css pseudo-element is a microsoft extension that represents check
boxes and radio button groups created by <input type="checkbox"> and <input type="radio">.
CSS - Archive of obsolete content
elements' ancestors have this pseudo-class applied to them.:-moz-system-metric()this page was auto-generated because a user created a sub-page to this page.::-ms-browsethe ::-ms-browse css pseudo-element is a microsoft extension that represents the button that opens the file picker of <input type="file">.::-ms-checkthe ::-ms-check css pseudo-element is a microsoft extension that represents check
boxes and radio button groups created by <input type="checkbox"> and <input type="radio">.::-ms-clearthe ::-ms-clear css pseudo-element creates a clear button at the edge of an <input type="text"> text control that clears the current value.
Game monetization - Game development
even though the digital market is key and you don't need to print covers and put your game in a physical store in
boxes, to earn decent money on selling your games for a fixed price you have to invest your time and money in marketing.
Normal Flow - Learn web development
first of all, individual element
boxes are laid out by taking the elements' content, then adding any padding, border and margin around them — it's that box model thing again, which we've looked at earlier.
Practical positioning examples - Learn web development
this includes information-heavy apps like strategy/war games, mobile versions of websites where the screen is narrow and space is limited, and compact information
boxes where you might want to make lots of information available without having it fill the whole ui.
Responsive design - Learn web development
on narrow screens the layout displays the
boxes stacked on top of one another: on wider screens they move to two columns: note: you can find the live example and source code for this example on github.
Getting started with CSS - Learn web development
if i want all paragraphs and all list items to be green my rule looks like this: p, li { color: green; } try this out in the interactive editor below (edit the code
boxes), or in your local css document.
Other form controls - Learn web development
<select id="multi" name="multi" multiple size="2"> <optgroup label="fruits"> <option>banana</option> <option selected>cherry</option> <option>lemon</option> </optgroup> <optgroup label="vegetables"> <option>carrot</option> <option>eggplant</option> <option>potato</option> </optgroup> </select> note: in the case of multiple choice select
boxes, you'll notice that the select box no longer displays the values as drop-down content — instead, all values are displayed at once in a list, with the optional size attribute determining the height of the widget.
Styling web forms - Learn web development
multi-line <textarea>s buttons (both <input> and <button>s) <label> <output> the bad some elements are more difficult to style, requiring more complex css or some more specific tricks: check
boxes and radio buttons <input type="search"> we describe how to handle these more specific features in the article advanced form styling.
Your first form - Learn web development
the controls can be single or multi-line text fields, dropdown
boxes, buttons, check
boxes, or radio buttons, and are mostly created using the <input> element, although there are some other elements to learn about too.
What is JavaScript? - Learn web development
a high-level definition javascript is a scripting or programming language that allows you to implement complex features on web pages — every time a web page does more than just sit there and display static information for you to look at — displaying timely content updates, interactive maps, animated 2d/3d graphics, scrolling video juke
boxes, etc.
JavaScript — Dynamic client-side scripting - Learn web development
every time a web page does more than just sit there and display static information for you to look at—displaying timely content updates, interactive maps, animated 2d/3d graphics, scrolling video juke
boxes, or more—you can bet that javascript is probably involved.
Mozilla accessibility architecture
for example, tables support nsiaccessibletable, text supports nsiaccessibletext and edit
boxes support nsieditabletext., although this code has been moved into the atk specific directories because it is not currently used in windows.
Embedding API for Accessibility
this is a much better alternative than having the user go through a long series of confirm
boxes for each new page, for each type of content.
ZoomText
combo
boxes report incorrect bounds, causing zoomtext tracking to move to the wrong area of the screen.
Debugging
note that these are replaced frequently by our tinder
boxes.
Performance
yedframescript("resources://my-addon/framescript.js"); services.ppmm.removedelayedprocessscript("resources://my-addon/processcript.js"); services.mm.broadcastasyncmessage("my-addon:unload"); services.ppmm.broadcastasyncmessage("my-addon:unload"); } in the frame/process scripts: remove all kinds of listeners remove observer notifications remove custom categories and services nuke sand
boxes unload jsms restore content dom states where necessary, e.g.
Introduction to Layout in Mozilla
(tables, blocks, xul
boxes) reflow “global” reflows initial, resize, style-change processed immediately via presshell method incremental reflows targeted at a specific frame dirty, content-changed, style-changed, user-defined nshtmlreflowcommand object encapsulates info queued and processed asynchronously, nsipressshell::appendreflowcommand, processreflowcommands...
Mozilla Web Developer FAQ
in the css2 box layout model the default vertical sizing of layout
boxes and the default vertical alignment of images is different from the behavior of old browsers.
about:memory
s ├──14.59 mb (54.52%) -- layout │ ├───6.22 mb (23.24%) ── style-sets │ ├───4.00 mb (14.95%) ── pres-shell │ ├───1.79 mb (06.68%) ── frames │ ├───0.89 mb (03.33%) ── style-contexts │ ├───0.62 mb (02.33%) ── rule-nodes │ ├───0.56 mb (02.10%) ── pres-contexts │ ├───0.47 mb (01.75%) ── line-
boxes │ └───0.04 mb (00.14%) ── text-runs ├───6.53 mb (24.39%) ── style-sheets ├───5.59 mb (20.89%) -- dom │ ├──3.39 mb (12.66%) ── element-nodes │ ├──1.56 mb (05.84%) ── text-nodes │ ├──0.54 mb (02.03%) ── other │ └──0.10 mb (00.36%) ++ (4 tiny) └───0.06 mb (00.21%) ── property-tables some of the trees ...
NSS API Guidelines
the nss apis are layered, as shown in this diagram: the
boxes in the gray section, towards the center, are exported only through pkcs #11.
JSAPI User Guide
there is no way to fix it except to destroy both sand
boxes and start over.
Gecko object attributes
note some widgets which appear to be check
boxes might in fact be cyclers (see "cycles" below).
XForms Accessibility
it can have the following representations: listbox check
boxes group select1 allows the user to choose a single value from a list of pre-defined values (see the spec, the docs).
Building the WebLock UI
at the top of all xul documents, an xml declaration is followed by the root element for the document, which is usually <window/> but for dialog
boxes can also be the element <dialog/>.
Preface
lines of code are placed in separate
boxes.
Components.utils.createObjectIn
this function is made available as a global in sand
boxes which have the wantexporthelpers option set in the sandbox() constructor.
Components.utils.evalInWindow
this function is made available as a global in sand
boxes which have the wantexporthelpers option set in the sandbox() constructor.
Components.utils.exportFunction
exportfunction() is made available as a global in sand
boxes which have the wantexporthelpers option set in the sandbox() constructor.
Folders
folders have a number of interesting attributes: parent subfolder server uri flags and methods getdatabase ( how to get a database of the messages in the folder.) updatefolder (gets new messages for that folder, if applicable, e.g., pop3 in
boxes, imap folders, news folders, rss folders) ...
IAccessibleText
the same functionality could be achieved by using the bounding
boxes for each character as returned by characterextents().
IAccessibleValue
1.0 66 introduced gecko 1.9 inherits from: iunknown last changed in gecko 1.9 (firefox 3) the iaccessiblevalue interface represents a single numerical value and should be implemented by any class that supports numerical value like progress bars and spin
boxes.
nsIDOMWindowUtils
this number also counts restyling of pseudo-elements and anonymous
boxes.
nsIXPConnect
used to separate code from the same principal into different compartments, as for sand
boxes.
XPCOM primitive
an xpcom primitive is an xpcom object that "
boxes" a value of a primitive type.
XPCOM reference
(i'm fully aware that this will be a great point of discussion and probably will end in tears, but since i'm the first person to apparently take a swing at this, i get first dibs.)xpcom primitivean xpcom primitive is an xpcom object that "
boxes" a value of a primitive type.
Xray vision
as well as these two levels of privilege, chrome code can create sand
boxes.
Thunderbird Binaries
they are built every 24 hours by the tinder
boxes from the very latest source code.
WebIDL bindings
xpconnect sand
boxes doesn't see [securecontext] apis, but this may change in bug 1273687.
Zombie compartments
│ │ │ │ ├──0.04 mb (00.01%) ── style-contexts │ │ │ │ ├──0.03 mb (00.01%) -- frames │ │ │ │ │ ├──0.02 mb (00.00%) ── sundries │ │ │ │ │ └──0.01 mb (00.00%) ── nsblockframe │ │ │ │ ├──0.01 mb (00.00%) ── pres-contexts │ │ │ │ ├──0.01 mb (00.00%) ── line-
boxes │ │ │ │ └──0.00 mb (00.00%) ── text-runs │ │ │ ├──3.78 mb (00.76%) ++ js-compartment(https://www.google.de/?gws_rd=ssl) │ │ │ ├──0.51 mb (00.10%) ── style-sheets │ │ │ ├──0.33 mb (00.07%) -- dom │ │ │ │ ├──0.17 mb (00.04%) ── text-nodes │ │ │ │ ├──0.13 mb (00.03%) ── elem...
Mozilla
gecko's "almost standards" mode "almost standards" rendering mode is exactly the same as "standards" mode in all details save one, where it works like "quirks" mode: the height calculations for line
boxes and some of the inline elements in them.
Gecko Plugin API Reference - Plugins
-ins printing the plug-in setting the window getting information windowed plug-ins mac os windows unix event handling for windowed plug-ins windowless plug-ins specifying that a plug-in is windowless invalidating the drawing area forcing a paint message making a plug-in opaque making a plug-in transparent creating pop-up menus and dialog
boxes event handling for windowless plug-ins streams receiving a stream telling the plug-in when a stream is created telling the plug-in when a stream is deleted finding out how much data the plug-in can accept writing the stream to the plug-in sending the stream in random-access mode sending the stream in file mode sending a stream creating a stream pushing data into the stream ...
Browser Console - Firefox Developer Tools
to enable it set the devtools.chrome.enabled preference to true in about:config, or set the "enable browser chrome and add-on debugging tool
boxes" (firefox 40 and later) option in the developer tool settings.
Browser Toolbox - Firefox Developer Tools
to do this, open the developer tools settings, go to the section "advanced settings", and check the settings "enable browser chrome and add-on debugging tool
boxes" and "enable remote debugging".
Breaking on exceptions - Firefox Developer Tools
to instruct the debugger to pause on an exception, tick these check
boxes in the breakpoints list: pause on exceptions pause on caught exceptions when an exception occurs, the line where it occurs is highlighted in the source pane, with a squiggly red line under the problematic code.
Examine and edit CSS - Firefox Developer Tools
der :-moz-progress-bar :-moz-range-progress :-moz-range-thumb :-moz-range-track :-moz-selection if the selected element has pseudo-elements applied to it, they are displayed before the selected element but hidden by a disclosure triangle: clicking the triangle displays them: viewing common pseudo-classes there's a button to the right of the filter box: click the button to see check
boxes that you can use to enable the :hover, :active and :focus, :focus-within and :visited pseudo-classes for the selected element: this feature can also be accessed from the popup menu in the html view.
Examine and edit the box model - Firefox Developer Tools
viewing the box model with the select element button pressed, if you hover over an element in the page, the box model for the element is shown overlaid on the page: it's also shown overlaid if you hover over an element's markup in the html pane: if the element is inline and is split over multiple line
boxes, the highlighter shows each individual line box that together make up the element: the box model view when an element's selected, you can get a detailed look at the box model in the box model view: if you hover over a value, you'll see a tooltip telling you which rule the value comes from: if you hover over part of the box model in the box model view, the corresponding part of the page is highlighted: editing the box model you can also edit the values in the box ...
Debugging Firefox Desktop - Firefox Developer Tools
enable remote debugging first, you'll need to ensure that both debugger and debuggee have the "enable browser chrome and add-on debugging tool
boxes" and "enable remote debugging" settings checked in the developer tools settings.
Element.clientHeight - Web APIs
the element.clientheight read-only property is zero for elements with no css or inline layout
boxes; otherwise, it's the inner height of an element in pixels.
FormData() - Web APIs
those with a name, not disabled and checked (radio buttons and check
boxes) or selected (one or more options within a select).
HTMLInputElement - Web APIs
for check
boxes, the effect is that the appearance of the checkbox is obscured/greyed in some way as to indicate its state is indeterminate (not checked but not unchecked).
Recommended Drag Types - Web APIs
for example: event.datatransfer.setdata("text/plain", "this is text to drag"); dragging text in text
boxes and selections on web pages is done automatically by the browser, so you do not need to handle it yourself.
Index - Web APIs
1103 element.clientheight api, cssom view, needsmarkupwork, property, reference the element.clientheight read-only property is zero for elements with no css or inline layout
boxes; otherwise, it's the inner height of an element in pixels.
Timing element visibility with the Intersection Observer API - Web APIs
articles each article is contained in an <article> element, styled like this: article { background-color: white; padding: 6px; } article:not(:last-child) { margin-bottom: 8px; } article h2 { margin-top: 0; } this creates article
boxes with a white background which float atop the blue background, with a small margin around the article.
Node - Web APIs
node.getboxquads() returns a list of the node's css
boxes relative to another node.
WebGL model view projection - Web APIs
box.draw({ top : 1, // x bottom : -1, // x left : -1, // y right : 1, // y depth : -1.5, // z color : [0.4, 0.4, 1, 1] // blue }); the results view on jsfiddle exercise a helpful exercise at this point is to move the
boxes around the clip space by varying the code to get a feel for how points get clipped and moved around in clip space.
Window.alert() - Web APIs
the following text is shared between this article, dom:window.prompt and dom:window.confirm dialog
boxes are modal windows - they prevent the user from accessing the rest of the program's interface until the dialog box is closed.
Window.devicePixelRatio - Web APIs
html the html creates the
boxes containing the instructions and the pixel-ratio box that will display the current pixel ratio information.
Window.prompt() - Web APIs
the following text is shared between this article, dom:window.confirm and dom:window.alert dialog
boxes are modal windows; they prevent the user from accessing the rest of the program's interface until the dialog box is closed.
Using the alert role - Accessibility
the pseudo code snippet below illustrates this approach: <p id="forminstruction">you must select at least 3 options</p> // when the user tries to submit the form with less than 3 check
boxes selected: document.getelementbyid("forminstruction").setattribute("role", "alert"); example 4: making an element with an alert role visible if an element already has role="alert" and is initially hidden using css, making it visible will cause the alert to fire as if it was just added to the page.
ARIA: grid role - Accessibility
if the grid includes a column with check
boxes to select rows, this key combination can be used to check that box even if the focus is not on the checkbox.
ARIA: button role - Accessibility
a third mixed state is available for toggle buttons that control other elements, such as other toggle buttons or check
boxes, which do not all share the same value.
-webkit-overflow-scrolling - CSS: Cascading Style Sheets
formal definition initial valueautoapplies toscrolling
boxesinheritedyescomputed valueas specifiedanimation typediscrete formal syntax auto | touch examples html <div class="scroll-touch"> <p> this paragraph has momentum scrolling </p> </div> <div class="scroll-auto"> <p> this paragraph does not.
::cue-region - CSS: Cascading Style Sheets
the only exception is that background and its shorthand properties apply to each cue individually, to avoid creating
boxes and obscuring unexpectedly large areas of the media.
::cue - CSS: Cascading Style Sheets
the only exception is that background and its longhand properties apply to each cue individually, to avoid creating
boxes and obscuring unexpectedly large areas of the media.
:checked - CSS: Cascading Style Sheets
note: for an analogous effect, but based on the :hover pseudo-class and without hidden radio
boxes, see this demo, taken from the :hover reference page.
:hover - CSS: Cascading Style Sheets
note: for an analogous effect, but based on the :checked pseudo-class (applied to hidden radio
boxes), see this demo, taken from the :checked reference page.
:indeterminate - CSS: Cascading Style Sheets
the :indeterminate css pseudo-class represents any form element whose state is indeterminate, such as check
boxes which have their html indeterminate attribute set to true, radio buttons which are members of a group in which all radio buttons are unchecked, and indeterminate <progress> elements.
CSS Backgrounds and Borders - CSS: Cascading Style Sheets
(additionally, element
boxes can be decorated with a shadow.) reference css properties background background-attachment background-clip background-color background-image background-origin background-position background-position-x background-position-y background-repeat background-size border border-bottom border-bottom-color border-bottom-left-radius border-bottom-right-radius border-bottom-style border-bottom-width border-collapse border-color border-image border-image-outset border-image-repeat border-image-slice border...
CSS Basic Box Model - CSS: Cascading Style Sheets
css basic box model is a module of css that defines the rectangular
boxes—including their padding and margin—that are generated for elements and laid out according to the visual formatting model.
Cross-browser Flexbox mixins - CSS: Cascading Style Sheets
this set uses: fallbacks using 2009 'box' syntax (ff and older webkit) and prefixed syntaxes (ie10, webkit browsers without flex wrapping) final standards syntax (ff, safari, chrome, ie11+, edge, opera) this was inspired by: http://dev.opera.com/articles/view/advanced-cross-browser-flexbox/ with help from: http://w3.org/tr/css3-flexbox/ http://the-echoplex.net/flexy
boxes/ http://msdn.microsoft.com/en-us/library/ie/hh772069(v=vs.85).aspx http://css-tricks.com/using-flexbox/ a complete guide to flexbox | css-tricks visual guide to css3 flexbox: flexbox playground | note: mixins are not currently supported natively in browsers.
align-content - CSS: Cascading Style Sheets
baseline first baseline last baseline specifies participation in first- or last-baseline alignment: aligns the alignment baseline of the box’s first or last baseline set with the corresponding baseline in the shared first or last baseline set of all the
boxes in its baseline-sharing group.
appearance (-moz-appearance, -webkit-appearance) - CSS: Cascading Style Sheets
uto> = searchfield | textarea | push-button | slider-horizontal | checkbox | radio | square-button | menulist | listbox | meter | progress-bar examples the following would make an element look like a menulist button: .exampleone { appearance: menulist-button; } see also this jsfiddle for an example showing how you might use appearance: none to apply custom styling to radio buttons and check
boxes.
aspect-ratio - CSS: Cascading Style Sheets
formal definition initial valueautoapplies toall elements except inline
boxes and internal ruby or table
boxesinheritednocomputed valueas specifiedanimation typediscrete formal syntax auto | <ratio> examples mapping width and height to aspect-ratio firefox has added an internal aspect-ratio property (in version 69 onwards) that applies to replaced elements and other related elements that accept width and height attributes.
box-ordinal-group - CSS: Cascading Style Sheets
when the computed box-direction is normal, a box will display its elements starting from the lowest numbered ordinal group and ensure that those elements appear to the left (for horizontal
boxes) or at the top (for vertical
boxes) of the container.
box-sizing - CSS: Cascading Style Sheets
for example, if you have four
boxes with width: 25%;, if any has left or right padding or a left or right border, they will not by default fit on one line within the constraints of the parent container.
column-count - CSS: Cascading Style Sheets
formal definition initial valueautoapplies toblock containers except table wrapper
boxesinheritednocomputed valueas specifiedanimation typean integer formal syntax <integer> | auto examples splitting a paragraph across three columns html <p class="content-box"> this is a bunch of text split into three columns using the css `column-count` property.
column-width - CSS: Cascading Style Sheets
formal definition initial valueautoapplies toblock containers except table wrapper
boxesinheritednocomputed valuethe absolute length, zero or largeranimation typea length formal syntax <length> | auto examples setting column width in pixels html <p class="content-box"> lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.
columns - CSS: Cascading Style Sheets
formal definition initial valueas each of the properties of the shorthand:column-width: autocolumn-count: autoapplies toblock containers except table wrapper
boxesinheritednocomputed valueas each of the properties of the shorthand:column-width: the absolute length, zero or largercolumn-count: as specifiedanimation typeas each of the properties of the shorthand:column-width: a lengthcolumn-count: an integer formal syntax <'column-width'> | <'column-count'> examples setting three equal columns html <p class="content-box"> this is a bunch of text split...
grid-area - CSS: Cascading Style Sheets
formal definition initial valueas each of the properties of the shorthand:grid-row-start: autogrid-column-start: autogrid-row-end: autogrid-column-end: autoapplies togrid items and absolutely-positioned
boxes whose containing block is a grid containerinheritednocomputed valueas each of the properties of the shorthand:grid-row-start: as specifiedgrid-column-start: as specifiedgrid-row-end: as specifiedgrid-column-end: as specifiedanimation typediscrete formal syntax <grid-line> [ / <grid-line> ]{0,3}where <grid-line> = auto | <custom-ident> | [ <integer> && <custom-ident>?
grid-column-end - CSS: Cascading Style Sheets
formal definition initial valueautoapplies togrid items and absolutely-positioned
boxes whose containing block is a grid containerinheritednocomputed valueas specifiedanimation typediscrete formal syntax <grid-line>where <grid-line> = auto | <custom-ident> | [ <integer> && <custom-ident>?
grid-column-start - CSS: Cascading Style Sheets
formal definition initial valueautoapplies togrid items and absolutely-positioned
boxes whose containing block is a grid containerinheritednocomputed valueas specifiedanimation typediscrete formal syntax <grid-line>where <grid-line> = auto | <custom-ident> | [ <integer> && <custom-ident>?
grid-column - CSS: Cascading Style Sheets
formal definition initial valueas each of the properties of the shorthand:grid-column-start: autogrid-column-end: autoapplies togrid items and absolutely-positioned
boxes whose containing block is a grid containerinheritednocomputed valueas each of the properties of the shorthand:grid-column-start: as specifiedgrid-column-end: as specifiedanimation typediscrete formal syntax <grid-line> [ / <grid-line> ]?where <grid-line> = auto | <custom-ident> | [ <integer> && <custom-ident>?
grid-row-end - CSS: Cascading Style Sheets
formal definition initial valueautoapplies togrid items and absolutely-positioned
boxes whose containing block is a grid containerinheritednocomputed valueas specifiedanimation typediscrete formal syntax <grid-line>where <grid-line> = auto | <custom-ident> | [ <integer> && <custom-ident>?
grid-row-start - CSS: Cascading Style Sheets
formal definition initial valueautoapplies togrid items and absolutely-positioned
boxes whose containing block is a grid containerinheritednocomputed valueas specifiedanimation typediscrete formal syntax <grid-line>where <grid-line> = auto | <custom-ident> | [ <integer> && <custom-ident>?
grid-row - CSS: Cascading Style Sheets
formal definition initial valueas each of the properties of the shorthand:grid-row-start: autogrid-row-end: autoapplies togrid items and absolutely-positioned
boxes whose containing block is a grid containerinheritednocomputed valueas each of the properties of the shorthand:grid-row-start: as specifiedgrid-row-end: as specifiedanimation typediscrete formal syntax <grid-line> [ / <grid-line> ]?where <grid-line> = auto | <custom-ident> | [ <integer> && <custom-ident>?
offset-path - CSS: Cascading Style Sheets
yntax /* default */ offset-path: none; /* function values */ offset-path: ray(45deg closest-side contain); /* url */ offset-path: url(#path); /* shapes */ offset-path: circle(50% at 25% 25%); offset-path: inset(50% 50% 50% 50%); offset-path: polygon(30% 0%, 70% 0%, 100% 50%, 30% 100%, 0% 70%, 0% 30%); offset-path: path('m 0,200 q 200,200 260,80 q 290,20 400,0 q 300,100 400,200'); /* geometry
boxes */ offset-path: margin-box; offset-path: stroke-box; /* global values */ offset-path: inherit; offset-path: initial; offset-path: unset; values ray() taking up to three values, defines a path that is a line segment starting from the position of the box and proceeds in the direction defined by the specified angle similar to the css gradient angle where 0deg is up, with positive angles incre...
overscroll-behavior-block - CSS: Cascading Style Sheets
formal definition initial valueautoapplies tonon-replaced block-level elements and non-replaced inline-block elementsinheritednocomputed valueas specifiedanimation typediscrete formal syntax contain | none | auto examples preventing block overscrolling in this demo we have two block-level
boxes, one inside the other.
overscroll-behavior-inline - CSS: Cascading Style Sheets
formal definition initial valueautoapplies tonon-replaced block-level elements and non-replaced inline-block elementsinheritednocomputed valueas specifiedanimation typediscrete formal syntax contain | none | auto examples preventing inline overscrolling in this demo we have two block-level
boxes, one inside the other.
overscroll-behavior-x - CSS: Cascading Style Sheets
formal definition initial valueautoapplies tonon-replaced block-level elements and non-replaced inline-block elementsinheritednocomputed valueas specifiedanimation typediscrete formal syntax contain | none | auto examples preventing an underlying element from scrolling horizontally in our simple overscroll-behavior-x example (see source code also), we have two block-level
boxes, one inside the other.
place-content - CSS: Cascading Style Sheets
baseline first baseline last baseline specifies participation in first- or last-baseline alignment: aligns the alignment baseline of the box’s first or last baseline set with the corresponding baseline in the shared first or last baseline set of all the
boxes in its baseline-sharing group.
scroll-behavior - CSS: Cascading Style Sheets
formal definition initial valueautoapplies toscrolling
boxesinheritednocomputed valueas specifiedanimation typediscrete formal syntax auto | smooth examples setting smooth scroll behavior html <nav> <a href="#page-1">1</a> <a href="#page-2">2</a> <a href="#page-3">3</a> </nav> <scroll-container> <scroll-page id="page-1">1</scroll-page> <scroll-page id="page-2">2</scroll-page> <scroll-page id="page-3">3</scroll-page> </scroll-container> c...
scrollbar-color - CSS: Cascading Style Sheets
formal definition initial valueautoapplies toscrolling
boxesinheritedyescomputed valueas specifiedanimation typea color formal syntax auto | dark | light | <color>{2}where <color> = <rgb()> | <rgba()> | <hsl()> | <hsla()> | <hex-color> | <named-color> | currentcolor | <deprecated-system-color>where <rgb()> = rgb( <percentage>{3} [ / <alpha-value> ]?
shape-outside - CSS: Cascading Style Sheets
by default, inline content wraps around its margin box; shape-outside provides a way to customize this wrapping, making it possible to wrap text around complex objects rather than simple
boxes.
transform - CSS: Cascading Style Sheets
that is, all elements whose layout is governed by the css box model except for: non-replaced inline
boxes, table-column
boxes, and table-column-group
boxes.
Challenge solutions - Developer guides
solution add a rule to the body element (parent of the headings) to reset a new counter, and one to display and increment the counter on the headings: /* numbered headings */ body {counter-reset: headnum;} h3:before { content: "(" counter(headnum, upper-latin) ") "; counter-increment: headnum; }
boxes ocean border challenge add one rule to your stylesheet, making a wide border all around the oceans in a color that reminds you of the sea.
disabled - HTML: Hypertext Markup Language
<fieldset> <legend>check
boxes</legend> <p><label> <input type="checkbox" name="chbox" value="regular"> regular </label></p> <p><label> <input type="checkbox" name="chbox" value="disabled" disabled> disabled </label></p> </fieldset> <fieldset> <legend>radio buttons</legend> <p><label> <input type="radio" name="radio" value="regular"> regular </label></p> <p><label> <input type="radio" name="rad...
HTML documentation index - HTML: Hypertext Markup Language
120 <input type="checkbox"> element, html, html forms, input, input types, reference, checkbox, form <input> elements of type checkbox are rendered by default as
boxes that are checked (ticked) when activated, like you might see in an official government paper form.
onunload - XUL
this code is used by some programmers to annoyingly pop up alert
boxes preventing the users from leaving the page.