Pascal: CSS navi mit visibility, brauche dringend hilfe.

SELF-Forum

CSS navi mit visibility, brauche dringend hilfe.

Pascal
– Informationen zu den Bewertungsregeln

hallo,

ich brauche hilfe bei meiner css navigation. die navi soll aus einem textfeld, einer art anleser bestehen und beim rüberfahren sind dann die einzelnen links sichtbar.

bis jetzt habe ich folgendes geschafft:

css:
-----------------------------------------------------------------------
a.kontakt:hover li
{
visibility:hidden;
}
a.kontakt
{
text-decoration:none;
font-size:9px;
}
a.kontakt:hover
{
font-size:10px;
}
a.kontakt span
{
visibility:hidden;
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:9px;
color: #585858;
}
a.kontakt:hover span, a.kontakt:focus span
{
visibility:visible;
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:9px;
}
a.kontakt:active span
{
visibility:hidden;
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:9px;
}

html:
-----------------------------------------------------------------------
<table width="400" border="1">
  <tr>
    <td>headline</td>
  </tr>
  <tr>
    <td>
 <a class="kontakt" href="#">
   <ul>
     <li>text 1<span style="margin-left:-30px;">link 1</span></li>
     <li>text 2<span style="margin-left:-30px;">link 2</span></li>
     <li>text 3<span style="margin-left:-30px;">link 3</span></li>
      </ul>
   </a>
 </td>
  </tr>
</table>

das funktioniert auch recht gut, aber wenn ich die links jetzt in ein <a>-tag setze spinnt das ganze system.

an dieser stelle komme ich einfach nicht weiter...
ich hoffe das ihr mir weiter helfen könnt.

gruss: Pascal.

Beitrag melden
–
Informationen zu den Bewertungsregeln

  1. CSS navi mit visibility, brauche dringend hilfe.

    suit Homepage des Autors
    – Informationen zu den Bewertungsregeln

    html:

    ich würde sagen, das sieht nur aus wie html

    <table width="400" border="1">
      <tr>
        <td>headline</td>
      </tr>
      <tr>
        <td>
    <a class="kontakt" href="#">
       <ul>
         <li>text 1<span style="margin-left:-30px;">link 1</span></li>
         <li>text 2<span style="margin-left:-30px;">link 2</span></li>
         <li>text 3<span style="margin-left:-30px;">link 3</span></li>
          </ul>
       </a>
    </td>
      </tr>
    </table>

    das funktioniert auch recht gut, aber wenn ich die links jetzt in ein <a>-tag setze spinnt das ganze system.

    das sieht vielleicht aus wie gewünscht, es ist aber höchst defekt

    ein in einem a-element darf kein ul-element vorkommen

    Beitrag melden
    –
    Informationen zu den Bewertungsregeln