List item disappears in Firefox

Greenhorn

Posts: 28

posted 19 years ago

Number of slices to send:

Optional 'thank-you' note:

Send

When I display the following page in Firefox, list item 1 & its children do not appear. The only way I have been able to get them to appear is to delete the entire <div id="functions"> above it. Although this is not the final arrangement of the page, I will need to be able to access these functions. How can I keep the top section and still see all of the list items in the lower section? (BTW, this does not happen in IE.) Thanks in advance!

<?xml version="1.0" encoding="ISO-8859-1"?>
 
  <!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en-US" lang="en-US">
  <head>
    <title>Outline Frame</title>
    <link rel="stylesheet" type="text/css" href="css/abc.css" />
    <link rel="stylesheet" type="text/css" href="css/def.css" />
    <script src="scripts/myOutline.js" type="text/javascript" > </script>
 
    </head>
  <body>
    <div id="functions">
      <div id="header">
        <ul>
          <li><a href="javascript:addSection()" class="function"><span>
Add Item
</span></a></li>
          <li><a href="javascript:insertSection()" class="function"><span>
 
Insert Item
</span></a></li>
          <li><a href="javascript :mrgreen: eleteItem()" class="function"><span>
Delete Item
</span></a></li>
          <li><a href="javascript:aliasItem( '1' )" class="function"><span>
Alias
</span></a></li>
          <li><a href="javascript :-P	 romote()" class="function"><span>
Promote 
 
</span></a></li>
          <li><a href="javascript :mrgreen: emote()" class="function"><span>
Demote
</span></a></li>
          <li><a href="javascript:moveUp()" class="function"><span>
Move Up
</span></a></li>
          <li><a href="javascript:moveDown()" class="function"><span>
Move Down
</span></a></li>
          <li><a href="javascript:saveOutline( '1' )" class="function"><span>
 
Save
</span></a></li>
          <li><a href="javascript:editItem()" class="function"><span>
Edit
</span></a></li>
        </ul>
      </div>
    </div>
 
    <div>
<form method="post" action="outline.do?edit=yes&doc_id=1" enctype="application/x-www-form-urlencoded>
 
<input type="hidden" name="doc_id" value="1" /><ol id="outlineEdit">
     <li sequence="1" id="1" class="level1" ><p class="item" >Section 1 Rev 2</p>
   <ol xmlns="">
     <li sequence="1.1" id="4" class="level2" ><p class="item" >Section 4</p>
   </li>
     <li sequence="1.2" id="5" class="level2" ><p class="item" >Section 5</p>
   </li>
 
     <li sequence="1.3" id="6" class="level2" ><p class="item" >Section 6</p>
   </li></ol></li>
     <li sequence="2" id="7" class="level1" ><p class="item" >Section 7</p>
   <ol xmlns="">
     <li sequence="2.1" id="10" class="levelAlias2" ><p class="item" >Section 10</p>
   <ol>
     <li sequence="2.1.1" id="8" class="levelAlias3" ><p class="item"  >Section 8</p>
 
   </li></ol></li></ol></li>
     <li sequence="3" id="2069" class="level1" ><p class="item" >aaaaaa</p>
   </li>
     <li sequence="4" id="9" class="level1" ><p class="item" >Editing section 9.</p>
   </li>
     <li sequence="5" id="2065" class="level1" ><p class="item" >sdfg sfdg dfsg sfdg</p>
   </li>
 
     <li sequence="6" id="2070" class="level1" ><p class="item"  >jhgkjhgkjhgkjhgkjhg</p>
   </li>
     <li sequence="7" id="2068" class="level1" ><p class="item" >asdf af adsf</p>
   </li>
     <li sequence="8" id="2" class="level1" ><p class="item" >Section 2 Rev</p>
   </li>
     <li sequence="9" id="3" class="level1" ><p class="item" >Section 3 Rev</p>
 
   <ol xmlns="">
     <li sequence="9.1" id="2064" class="level2" ><p class="item" >sadf sadf sad</p>
   </li>
     <li sequence="9.2" id="2066" class="level2" ><p class="item"> lkj ;j ;lkj</p>
   <ol>
     <li sequence="9.2.1" id="2067" class="level3" ><p class="item" >uyt uyt iut iu t</p>
   </li>
 
     <li sequence="9.2.2" id="2060" class="level3" ><p class="item" >This is a new text item</p>
   </li></ol></li></ol></li></ol>
      <textarea id="outline" cols="80" rows="40" style="visibility:hidden" name="outline"/></form></div>
  </body>
</html>

Eric Pascarello

author

Posts: 15385

posted 19 years ago

Number of slices to send:

Optional 'thank-you' note:

Send

What is the CSS attached to the div?

Eric

Rob Lynn

Greenhorn

Posts: 28

posted 19 years ago

Number of slices to send:

Optional 'thank-you' note:

Send

I tried to pick out all of the entries that apply to this page (the file is pretty long):

body {
background-color: white;
color: black;
font-family: verdana, arial, helvetica, sans-serif;
font-size: 10pt;
border: 0 0 0 0;
padding: 0 0 0 0;
margin: 0 0 0 0;
}
#header {
float: left;
width:100%;
background:#cadfcf url("../images/bg.gif") repeat-x bottom;
font-size:93%;
line-height:normal;
}
#header ul {
margin:0;
padding:5px 0px 0px 5px;
list-style:none;
}
 
#header li {
display: inline;
margin: 0;
padding: 0;
}
#header a {
float:left;
background:url("../images/left_both.gif") no-repeat left top;
margin: 0;
padding:0 0 0 9px;
text-decoration:none;
border-bottom:1px solid #765;
}
#header a.function {
float:right;
background:none;
width:auto;
padding:0 0 0 0px;
text-decoration:none;
border-bottom:0px none;
}
#header a span {
float:left;
display:block;
background:url("../images/right_both.gif") no-repeat right top;
padding:5px 15px 4px 6px;
text-decoration:none;
font-weight:bold;
color:#666;
white-space:nowrap;
}
#header a.function span {
float:right;
background:none;
display:block;
width:auto;
padding:5px 15px 4px 6px;
text-decoration:none;
font-weight:bold;
color:#666;
white-space:nowrap;
}
ol {
margin-left: 15px; 
padding: 5px;
}
ol.outlineEdit li { list-style-type: decimal;}
#functions { 
padding-top: 10px;
}

Rob Lynn

Greenhorn

Posts: 28

posted 19 years ago

Number of slices to send:

Optional 'thank-you' note:

Send

Sorry, I must have left out something important in my last post. I tried the above out and it displayed ok. So I copied more of one of my css files in and had the problem. Here's the revised css:

body {background-color: white;
color: black;
font-family: verdana, arial, helvetica, sans-serif;
font-size: 10pt;
border: 0 0 0 0;
padding: 0 0 0 0;
margin: 0 0 0 0;}
#header {
float: left;
width:100%;
background:#cadfcf url("../images/bg.gif") repeat-x bottom;
font-size:93%;
line-height:normal;}
#header ul {
margin:0;
padding:5px 0px 0px 5px;
list-style:none;}
#header li {
 display: inline;
margin: 0;
padding: 0;}
#header a {
float:left;
background:url("../images/left_both.gif") no-repeat left top;
margin: 0;
padding:0 0 0 9px;
text-decoration:none;
border-bottom:1px solid #765;}
#header a.function {
float:right;
background:none;
width:auto;
padding:0 0 0 0px;
text-decoration:none;
border-bottom:0px none;}
#header a span {
float:left;
display:block;
background:url("../images/right_both.gif") no-repeat right top;
padding:5px 15px 4px 6px;
text-decoration:none;
font-weight:bold;
color:#666;
white-space:nowrap;}
#header a.function span {
float:right;
background:none;
display:block;
width:auto;
padding:5px 15px 4px 6px;
text-decoration:none;
font-weight:bold;
color:#666;
white-space:nowrap;}
ol {margin-left: 15px;
 padding: 5px;}
ol.outlineEdit li { list-style-type: decimal;}
 
outline{display:block;
  margin-left:20px;
  list-style-type :mrgreen: ecimal;
  counter-reset:item;}
 
outline section{
  display:list-item;
}
 
outline{ 
  content: counter(item);
  counter-increment: item;
}
 
outlineItem{border:none}
 
p.item {
margin-top:2pt;
margin-bottom:0pt;
}
 
#functions { 
padding-top: 10px;
}

Rob Lynn

Greenhorn

Posts: 28

posted 19 years ago

Number of slices to send:

Optional 'thank-you' note:

Send

As soon as I looked at my last post, I realized what a mess my file was. I'm trying to remove old entries & clean it up a little (& put everything in 1 css instead of 2) - hopefully I can fix this on my own. Thanks!

With a little knowledge, a cast iron skillet is non-stick and lasts a lifetime.