If you style an ordered list that contains links with the experimental -moz-column-count the list items of the last columns will be renumbered when a link in that column is clicked.

Test page Workaround is included
Reported by: Brian Sweeney.

Sometimes you might want to mix text buttons with image buttons and insist on using the button tag. However, Firefox aligns the text buttons lower then the image buttons.

Test page Workaround is not included
Reported by: Laurens van der Klis.

When an element containing floats has overflow: auto, it is allowed to get focus. This can affect layout and cause problems with tabbing.

Test page Workaround is included
Reported by: Shane Shepherd.

When border-collapse: collapse; is applied to a table with borders and a hidden cell, all browsers have issues:

Firefox hides border in the table entirely if all the cells in the row are hidden but the row element is visible. This can be resolved by hiding the row element.

Internet Explorer renders the border of the row that has all it's cells hidden. This can be resolved by hiding the row element.

Opera doesn't render all of the top border of a table if any of the top row cells is hidden and there is atleast one visible cell on the row.

Safari and iCab don't render the td border at all if a cell is hidden.

Test page Workaround is included
Reported by: Merri.

The horizontal margins of a table are incorrectly added to its offsetWidth and clientWidth.

Test page. Workaround is not included.
Reported by ppk.

If you have an element set to float:right; and you follow it with another element set to clear:right; float:right; and then follow those first two elements with a third element set to float:left;, the third element will not float next to the first element, even though it is not actually being cleared.

This bug is also present when the directions are reversed.

(ppknote: Strictly speaking this is a bug in Explorer, but I find Dan's reasoning compelling enough to publish his report unaltered. Besides, other web developers will conceivably run across this behaviour in Safari, Opera, or Firefox. Be sure to click the "real world example" link on the test page.)

Test page Workaround is not included
Reported by: Dan Richman.

Repositioned content via JavaScript coupled with floats is triggering a variety of bugs in various browsers.

Test page Workaround is not included
Reported by: Chris Hester.

Placing a right-floated element in a left-positioned absolutely-positioned element causes the following behavior:

• Opera and iCab display correctly (I think); the absolutely-positioned element is sized to fit the float or other nodes of the element, whichever is wider
• Gecko stretches the absolutely-positioned element to the maximum width allowed by the containing block
• KHTML stretches the absolutely-positioned element to the sum of the width of the float and the other child nodes
• (ppknote: IE behaves as Firefox)

My understanding of the box model spec is that Opera and iCab's behavior is correct; if anyone can corroborate this it would be greatly appreciated.

Test page Workaround is not included
Reported by: Josh Fremer.

The outline property affects block sizes when contained by an element set to overflow: auto.

Test page Workaround is not included
Reported by: Marc Pacheco.

Firefox 1.5 appears to ignore the text-align property of a paragraph nested inside a position: absolute; overflow: hidden div.

Test page Workaround is not included
Reported by: Brian Tao.

In Firefox, when a button element and an input[type=text] element share a form, and the button element has a click handler, then that click handler function will get fired when the user focuses on the input[type=text] and presses return. The first time, the event target will be the input[type=text] element, but the second time it happens, it'l be the button element.

Workaround: use input[type=button] instead.

Test page Workaround is included
Reported by: Isaac Z. Schlueter.

A break tag in your code when text is aligned right causes a space at the end of the line. This has the effect that the last line in a group appears too far right.

Test page Workaround is included
Reported by: Chris Hester.

When the HTML table attribute border="1" is used with the CSS table property border-collapse: collapse; and the CSS table cell property border-style: none;, Mozilla incorrectly inserts a 1-pixel-wide black border between the cells in the table.

Test page Workaround is not included
Reported by: pauldwaite.

Events registered on img objects don't fire if the image has an associated image map, and the targeted part of the image is part of an area.

Test page Workaround is included
Reported by: Steve Joynt.

Scrollbars are not hidden when a div is hidden and overflow is set to auto or visible.

This happens with Mozilla on Mac only.

Test page Workaround is included
Reported by: Nate Hardt.

Positioning legend tags — what works and what doesn't? To be honest not a lot does.

I've tested — position: absolute, fixed, relative, floats margins and setting widths.

Test page Workaround is not included
Reported by: Marc Pacheco.

If an image is given various heights, but not a width, browsers enlarge it to fit the ratio of the physical dimensions of the image. But over a certain size, bugs can occur.

Test page Workaround is not included
Reported by: Chris Hester.

A floated or absolutely positioned element does not have a width and is stretched up by an image. When the image is swapped for a far smaller image, the parent element's width should diminish. Mozilla, though, doesn't diminish the width of the other elements in the floated element, and therefore the parent element retains its original width.

Test page. Workaround is not included.
Reported by ppk.

In Mozilla Firefox 1.5 when you scroll the form so that it is off-screen at the top then scroll back on-screen the underscores on the first letter of each line sometimes do not re-appear again. When scrolling to the end of the form and backup again, and when the browser window is resized to a smal size it seems even more persistent. This bug is triggered by styling label:first-letter {text-decoration: underline}.

(ppknote: This bug is quite flighty, I myself saw it only the third time I tried the test page.)

Test page Workaround is not included
Reported by: Johan Van Den Rym.

An event handler for onmouseover an anchor should not show the URL in the status bar when you return false, and it should when you return true, but actually it does exactly the opposite.

Test page Workaround is not included
Reported by: Lal.

Explorer Windows and Mac, Mozilla and Opera see <fieldset>s as form fields, even though the spec doesn't mention them in the list of control types.

Mozilla and Opera allow change events on <fieldset>s, even though they don't make sense.

Test page. Workaround is not included.
Reported by ppk.

Mozilla sends extraneous events with improper and invalid event.relatedTarget values instead of generating simple pairs of mouseover/mouseout events.

Test page Workaround is included
Reported by: Garret Wilson.

When a drop-down menu has a long option, and the form is placed inside a div of a shorter width, the option is cut off when the user scrolls far enough to the right.

Test page Workaround is not included
Reported by: Chris Hester.

If options in a form are given a large enough height and there are too many options to fit the screen, Firefox will display the menu upwards, leading to it being cut off.

(ppknote: Mozilla is the only browser that honours a height on options. Nonetheless this is certainly a bug.)

Test page Workaround is included
Reported by: Chris Hester.

When a form field before a group of radio buttons is removed from the document, and the page is subsequently reloaded, the check mark of the radio buttons moves upward.

Test page. Workaround is not included.
Reported by ppk.

If you add a class name with a leading space to an element that doesn't yet have a class name, Mozilla ignores the leading space.

x.className += ' over';

This can be a problem if you use a regexp to remove the class name, including the space. The regexp doesn't work in Mozilla.

x.className = x.className.replace(/ over/,'');

Test page. Workaround is not included.
Reported by ppk.

A scrollable element (overflow: auto) triggers a mouseout event on an overlaying layer, even when the mouse doesn't move outside the layer.

Test page Workaround is not included
Reported by: Stefan Jaeger.

When an element is positioned outside its parent element, Mozilla gives 0 as offsetWidth, Opera -1.
Mozilla also gives incorrect values, when some part of element is on the border of element. It gives back the size of "visible" area in parent element. So when half is in and half out, it gives half of the real width.

Test page Workaround is not included
Reported by: Mojmir Nebel.

Text inside a display:-moz-inline-block element cannot be aligned. Not only that, it doesn't do word wrapping.

Test page Workaround is not included
Reported by: Jordi Pujalte.

Setting multiple interval timers to run simultaneously causes the timers to become completely unreliable in Mozilla/Firefox and iCab.

In most browsers there is a slight variance between the requested timeout and the actual timeout (a few miliseconds per one second timeout). This is normal.

In Mozilla/Firefox, using multiple interval timers causes the intervals to be far too short (a fraction of the requested time), followed by one extremely long interval to make up for the short ones. This pattern then repeats.

Test page Workaround is included
Reported by: TarquinWJ.

When several DHTML layers on top of each other all contain an input field, and one of these layers has overflow: auto the cursor in the other input boxes becomes invisible.

Test page Workaround is not included
Reported by: Murray Hopkins.

When a non-visible overflow, and either left or right padding are used on an element, Mozilla/Firefox over compensates for the required height of the element, and leaves gaps underneath the element's contents.

Test page Workaround is not included
Reported by: TarquinWJ.

The DOM 2 event spec requires that the capture phase event handlers should only be activated on ancestors of the event target, and not the event target itself. Mozilla and Safari break this rule in different ways, and fire it on the event target as well.

Test page Workaround is included
Reported by: TarquinWJ.

When a floated list with overflow: auto; contains a dropdown, the dropdown disappears when changing its value (Mozilla) or never appears at all (Explorer Mac).

Test page Workaround is not included
Reported by: Benjamin.

Using firefox in Windows and Linux (same version) i get a problem where i cannot specify a shadow underneath text to be consistent, because the margin/padding differences are throwing me out - i have set paddings and margins of all elements to 0 - except the one i wish to change... it's highly annoying!

Test page Workaround is not included
Reported by: Tim.

(ppk disclaimer: I don't have a Linux test box, so I couldn't check this bug report)

window.opener.closed works in IE 6 but not in Mozilla or Opera due to a known bug. Also, in IE 5 window.opener.closed DOES NOT work correctly due to another known bug. I also have a longer writeup in my blog.

Test page Workaround is included
Reported by: Yakov Shafranovich.

When an li element is set to overflow: auto Firefox creates a horizontal scroll bar in most cases. Short entries not containing block level tags don't suffer from this problem.

The workaround is to wrap the content of a list item in a div and set the overflow on the div instead.

Test page Workaround is included
Reported by: Marc Pacheco.

When using an attribute selector like label[accesskey] in conjunction with the display: block: on a label element, a child select box will go blank and/or act strange in mozilla/firefox.

In Opera the last two "act funny" boxes also act funny.

Test page Workaround is included
Reported by: Brian Latimer.

If the string "text-transform: capitalize" is text-transformed to capitalize, should the "t" of "-transform" be capitalized, too?

Opera and Mozilla say No, but they're in the minority. Therefore this is officially a bug in Opera and Mozilla.

Test page. Workaround is not included.
Reported by ppk.

Hovering over a node doesn't count as a hover over its parent when it is positioned above an element with overflow:auto. The practical use for this technique lies in CSS menus on sites that make use of the pre element.

Test page Workaround is not included
Reported by: Damien Bezborodow.

When creating custom DTDs like the one below, all browsers except Opera see the end of the ATTLIST as the end of the DOCTYPE. The result is that they print "]>" on the screen.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
	"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"
[
<!ATTLIST p behavior CDATA #IMPLIED>
]>

Test page. Workaround is not included
Reported by ppk.

The box model of a td turns out to be unchangeable in Explorer (Win and Mac), Mozilla and Opera. Explorer Mac forces it into the traditional model, while the other browsers force it into the W3C box model.

Therefore you can't switch the box model of a td, something that is possible for any other element.

Explorer Windows, though, switches the TDs to the correct box model when you use table-layout: fixed. Unfortunately this does not work in the other browsers.

Test page. Workaround is included only for Explorer Windows.
Reported by ppk.

When a floating box appears directly after a header in Mozilla, the very first line of text after the float doesn't obey the float but is rendered right through the floating box.
The first floating box on a page is never affected by this bug, though.

Test page. Workaround is not included.
Reported by ppk.

Mozilla and Opera split up one huge text node into several smaller text nodes. Explorer Mac acts weirdly.

Maximum text node sizes:

• Mozilla: 4K
• Opera: 32K
• Explorer Mac: 64K (?)

Test page. Workaround is not included.
Reported by ppk.

Mozilla doesn't honour a position: relative on a table, which can therefore never serve as a container for absolutely positioned elements. This is a deliberate choice, and not a bug, oddly.

Test page. Workaround is not included.

On the other hand, Explorer Mac behaves as if every table has a position: relative. It always positions absolute layers in the table relative to the table, even if they should be positioned relative to the browser window.

Test page. Workaround is not included.
Reported by ppk.

When seting class names dynamically through JavaScript, Mozilla doesn't apply the first-letter and first-line styles.

Test page. Workaround is not included.
Reported by ppk.

If both a strict XHTML doctype tag and an XML prolog are written into a popup using separate document.write commands, Mozilla/Firefox/Gecko based browsers will revert to quirks mode, instead of standards compliant mode.

Test page. Workaround is not included.
Reported by TarquinWJ.

font-weight: 600 and font-weight: bold are not equivalent. The browsers stretch up their fonts when you use 600. For a really correct bold font you must use bold or 700.

Mozilla exhibits a similar bug only on Mac: any text with font-weight: 600 appears as normal, non-bold text.

Test page. Workaround is included.
Reported by ppk.

When you change the font size of button elements, odd things start to happen in IE Win & Mac, and Mozilla. Of course, each browser has its own take on 'odd things'. The Mozilla problem is solvable.

Test page. Workaround is included.
Reported by ppk.

Handling of innerHTML in XHTML pages (with MIME type application/xhtml+xml) is weird. Getting works, setting doesn't.

Test page. Workaround is not included.
Reported by ppk.

Any button uses the traditional box model instead of W3C's, regardless of rendering mode.

Test page. Workaround is included.
Reported by ppk.

When you define a document.onclick before the page has loaded completely and you use the Netscape 4-required captureEvents method, Mozilla fires the event handler twice on every click. This is apparently a very old bug.

Test page. Workaround is not included.
Reported by Matthieu Haller.