Zum Inhalt springen

probleme mit display: block;

Erstellt am 21. Juli 2004 · 2 Antworten · letzte Antwort am 21. Juli 2004

Tags: Frage

ffr_dev ·

hallo, bei meinem menü, will ich den link nicht nur auf den
text, sondern auf die ganze zelle.
das sieht folgendermassen aus:

<td id="topmenu-right">
   <table border="0" cellpadding="0" cellspacing="0">
      <tr>
         <td class="topmenu-no" onmouseover="this.className = 'topmenu-no-roll'" onmouseout="this.className = 'topmenu-no'">
            <a href="index.php?id=6" onfocus="blurLink(this);" class="top-a-no">ITEM1</a>
         </td>
         <td class="topmenu-no" onmouseover="this.className = 'topmenu-no-roll'" onmouseout="this.className = 'topmenu-no'">
            <a href="index.php?id=5" onfocus="blurLink(this);" class="top-a-no">ITEM2</a>
         </td>
         <td class="topmenu-no" onmouseover="this.className = 'topmenu-no-roll'" onmouseout="this.className = 'topmenu-no'">
            <a href="index.php?id=4" onfocus="blurLink(this);" class="top-a-no">ITEM3</a>
         </td>
         <td class="topmenu-act">
            <a href="index.php?id=2" onfocus="blurLink(this);" class="top-a-act">ITEM4</a>
         </td>
      </tr>
   </table>
</td>

und meine css einträge sehen so aus

A.top-a-no{display: block; padding-top: 8px; padding-bottom: 8px;}
A.top-a-act{display: block; padding-top: 8px; padding-bottom: 8px;}

mein problem ist, das das ganze nur beim ITEM1 funktioniert.
habe aber keine ahnung wieso, sieht eigentlich alles gleich aus???

fabian.​schoen ·

Tag,

ich habe es mal schnell getestet und ich sehe da 2 Varianten, die bei mir funktioniert haben. Bin mir natuerlich nicht sicher, wie Standardkonform die sind.

Wenn es ueber Tables loesen willst, dann fuege doch noch eine width hinzu

A.top-a-no{display: block; padding-top: 8px; padding-bottom: 8px; width: 100%;}

Sauber finde ich es, wenn anstelle von Tables, DIV nehmen wuerdest

<div> <a href="index.php?id=6" onfocus="blurLink(this);" class="top-a-no">ITEM1</a> 
   </div>
   <div><a href="index.php?id=5" onfocus="blurLink(this);" class="top-a-no">ITEM2</a> 
   </div>

gruss
fabian

ffr_dev ·

vielen dank für die lösungen.
da mein ganzes seiten layout bereits mit tables erstellt ist, fahre ich auch weiterhin auf dieser schiene.

cu