# Firefox/MSIE issues

**URL:** <https://forum.kirupa.com/t/firefox-msie-issues/195809>\
**Category:** web dev\
**Created:** [August 3, 2006, 10:07am UTC](https://forum.kirupa.com/t/firefox-msie-issues/195809 "2006-08-03T10:07:12Z")\
**Posts on this page:** 1\
**Page:** 1

<div class="post-metadata">

**Author:** ![thomvincent](https://avatars.discourse-cdn.com/v4/letter/t/cab0a1/32.png) [@thomvincent](https://forum.kirupa.com/u/thomvincent)\
**Post date:** [August 3, 2006, 10:07am UTC](https://forum.kirupa.com/t/firefox-msie-issues/195809/1 "2006-08-03T10:07:12Z")

</div>

I have building a small menu for a blog site. I have a list of ten items in a box which will be ‘liquid’.

The CSS is as follows.

```auto
    .menu {
      float: right;
      width: 22%;
      margin-top: 0em;
      margin-left: 0.5em;
      margin-right: 0em;
      margin-bottom: 0.5em;
      padding: 0em;
      background: #eeeeee;
    }
    .menu ul {
      margin: 0em;
      padding: 0em;
      list-style-type: none;
    }
    .menu li {
      margin: 0em;
      float: left;
      padding-left: 0.2em;
      padding-right: 0.2em;
      padding-top: 0em;
      padding-bottom: 0.2em;
      background: #eeeeee;
      text-align: left;
      width: auto;
    }

```

Now in Firefox this works a treat. It all fits in neatly and more importanly it automatically linebreaks a **li** element if it cant fit width ways. MSIE however bunches the **li** into a horrible little box which in turn messes up the rest of the menu as per the example below.

![](http://www.thomvincent.com/css_browser.jpg)

Does anyone know any extra CSS or HTML that can fix this problem? Apart from that everything else works in both.