Text nicht umbrechen innen UL LI A

Ich habe ein XSLT-Skript zur Ausgabe einer einfachen, vertikalen Menü, allerdings auf ein paar von meinen links der text nicht umbrechen, und ich habe keine Ahnung, warum!

Haben versucht, ein DIV in dem link, sowie ein

enthalten den text, aber ohne Erfolg.

Niemand hatte diese Art von Problem vor?

XSLT:

    <xsl:template match="/">

  <xsl:variable name="items" select="$currentPage/ancestor-or-self::* [@isDoc and @level = 2]/* [@isDoc and string(umbracoNaviHide) != '1']"/>

<!-- The fun starts here -->
  <div id="subnavtitle">
  <xsl:value-of select="$currentPage/@nodeName" />
  </div>
<xsl:if test="count($items) &gt; 0">
<ul>
<xsl:for-each select="$items">
  <li>

    <xsl:if test="@id = $currentPage/@id">
        <xsl:attribute name="class">current</xsl:attribute>
      </xsl:if>
    <xsl:if test="@id = $currentPage/../@id">
        <xsl:attribute name="class">current</xsl:attribute>
      </xsl:if>
    <a href="{umbraco.library:NiceUrl(@id)}" >
      <p style="width: 100px;">
        <xsl:value-of select="translate(@nodeName,' ',' ')"/>
        </p>
    </a>

  </li>
</xsl:for-each>
</ul>
    </xsl:if>

</xsl:template>

CSS:

#subNavigation {
  padding-top: 10px;
  padding-right: 10px;
  padding-left: 10px;
  font-weight: bold;
  font-size: 12px;
  background-size: 100% auto;
  margin: 0px;

}
#subNavigation ul {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
}
#subNavigation ul:after {
  content: ".";
  display: block;
  font-size: 0;
  height: 0;
  clear: both;
  visibility: hidden;
}
* html #subNavigation ul {
  zoom: 1;
}
*:first-child + html #subNavigation ul {
  zoom: 1;
}
#subNavigation ul li {
  list-style-image: none;
  list-style-type: none;
  margin-left: 0px;
  white-space: nowrap;
  display: inline;
  float: left;
    background: url(Designit_Green/images/nav.png) repeat-x;
  margin-bottom: 10px;
  width: 150px;
}

#subNavigation li.current {
  background: #FFF url(Designit_Green/images/nav-item-activeXXX.png) left top repeat-x;
}
#subNavigation li.current a:hover {
  background: #FFF url(Designit_Green/images/nav-item-activeXXX.png) left top repeat-x;
}
#subNavigation li.current a {
  color: #333;
}
#subNavigation li:last-child {
  border: none;
}
#subNavigation a:link, #subNavigation a:visited {
  padding-left: 15px;
  padding-right: 0px;
  padding-top: 10px;
  padding-bottom: 10px;
  color: #FFF;
  display: block;
  text-decoration: none;

} 

Können Sie einen Blick auf das Ergebnis hier: http://bellstest.info/bar-restaurant.aspx
Das Problem mit dem linken Navigationsbereich.

InformationsquelleAutor Owain Reed | 2012-05-12