1

I am trying to design a form that uses the CSS inline-block display value for a table-like arrangement. I know that some browsers including Firefox 2 don't know how to handle it, so I used this method to make it work in all browsers. However, sometimes when I try it in Firefox 2, the browser freezes. My CPU usage gets stuck near 100% and sometimes the memory usage rapidly increases to a huge value. Does anyone know why this is happening or how to work around it? Here is a simple example of a page that shows this problem:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html><head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>-moz-inline-stack test</title>
<style type="text/css">
div {
    display: -moz-inline-stack;
}
</style>
</head>
<body>
<div>
    <input type="radio" name="test" value="yes">
    <br>
    <input type="radio" name="test" value="no">
</div>
</body></html>

It works fine in Firefox 3 but it freezes Firefox 2. The <br> tag is not necessary for the bug but it keeps the inputs from being on top of each other.

Elias Zamaria
  • 96,623
  • 33
  • 114
  • 148
  • I have decided to give up on this question. I tried Andy Ford's suggestion, and it kept the browser from crashing, but it caused other visual quirks. Eventually, I got my site to work in Firefox 2. It doesn't look quite the same, but I figured that so few people still use Firefox 2 that it is not worth it for me to try to diagnose this. If anyone cares, someone else will have to handle this question. – Elias Zamaria Jul 14 '09 at 19:13
  • This may be kind of late, but in case anyone is interested, here is where I learned about the trick: http://blog.mozilla.com/webdev/2009/02/20/cross-browser-inline-block/ – Elias Zamaria Sep 17 '09 at 19:01

1 Answers1

2

try this instead

div {
  display: -moz-inline-box;
  display: inline-block;
  }
Andy Ford
  • 8,410
  • 3
  • 26
  • 36