Anchor after last list item

[fierdor]

Is the following HTML wrong?

 

<ul style="text-align:center;" id="listhere">
<li id="rel1"><a href="#">3.4.1</a></li>
<div id="rel1content" style="display:none;">
<a href="#">Item 1</a>
<a href="#">Item 2</a>
</div>
<li id="rel2"><a href="#">3.4.2</a></li>
<div id="rel2content" style="display:none;">
<a href="#">Item 1</a>
<a href="#">Item 2</a>
</div>
</ul>

 

The strange thing is the div after rel1 shows up.....But the div after rel2 doesnt show up...

However instead of

 

<div id="rel2content" style="display:none;">
<a href="#">Item 1</a>
<a href="#">Item 2</a>
</div>

 

if I use this:

 

<div id="rel2content" style="display:none;">
Item 1
Item 2
</div>

 

It works...Some rule I am violating??

[joePHP]

Hi,

 

I'm only seeing:

• 3.4.1
  
• 3.4.2
  

 

While both div's are hidden.

However, I think you should us an UL instead of a DIV.

Like this:

<ul style="text-align:center;" id="listhere">
<li id="rel1"><a href="#">3.4.1</a>
	<ul id="rel1content" style="display:none;">
		<li><a href="#">Item 1</a></li>
		<li><a href="#">Item 2</a></li>
	</ul>
</li>	
<li id="rel2"><a href="#">3.4.2</a>
	<ul id="rel2content" style="display:none;">
		<li><a href="#">Item 1</a></li>
		<li><a href="#">Item 2</a></li>
	</ul>
</li>
</ul>

 

I hope this helps,

Joe

 

[haku]

<ul style="text-align:center;" id="listhere">
  <li id="rel1">
    <a href="#">3.4.1</a>
    <div id="rel1content" style="display:none;">
      <a href="#">Item 1</a>
      <a href="#">Item 2</a>
    </div>
  </li>
  <li id="rel2">
    <a href="#">3.4.2</a>
    <div id="rel2content" style="display:none;">
      <a href="#">Item 1</a>
      <a href="#">Item 2</a>
    </div>
  </li>
</ul>

[theverychap]

The reason it was breaking is because you cannot have any other elements inside a UL tag, the only allowed children of a UL are LI tags.

 

As Haku as posted, your DIVs should be _inside_ your LIs.

[fierdor]

Thank you!