CSS - Box Farbig

[baeckerman83]

Hi!
Ich habe eine Tabelle für ein Menü. Da der für den ich die Seite mache ein versetztes Menü haben möchte mal oben mal unten. Und mit dem Ausrichten geht es ja nur in Tabellen.
Dann habe ich
td {width:125;
backgroundcolor:red;
und a:hover {width:125;
backgroundcolor:white;}

Im IE 7.x geht es auch einwandfrei und auch beim Hover wird das Weiß ca 125px weit angezeigt.
Im FF jetzt aber macht er was ganz anderes und beim Hover setzt er nur das Wort selbst in weißen Hinter grund, also "Test" dann das Wort Test und nicht die ganzen 125px, das sieht etwas doof aus, weiß jemand wie ich das lösen kann?
poste auch gerne den ganzen Quelltext.

[cygnus]

Hallo :)

Ich weiss nicht mehr, welcher der anderen user es war, der diesen Link hier ins Forum gestellt hat:
http://css.maxdesign.com.au/listamatic/

Da ist eigentlich für jeden Geschmack etwas dabei, und es wird besser als mit Tabellen.

mfg
cygnus

[baeckerman83]

Hallo :)

Ich weiss nicht mehr, welcher der anderen user es war, der diesen Link hier ins Forum gestellt hat:
http://css.maxdesign.com.au/listamatic/

Da ist eigentlich für jeden Geschmack etwas dabei, und es wird besser als mit Tabellen.

mfg
cygnus

Mhm da ist leider nichts dabei, kenne die Seite. Es soll halt so aussehen:
-_-_-_

Also die Striche Symbolisieren die Buttons. Diese sollen so versetzt sein.

body {  
    font: normal 100.01% Helvetica, Arial, sans-serif;  
    color: #FFFFFF; background-color: #D51D1D;  
  }  
table {  
    padding: 0;  
    margin: 0;  
   }  
  
  td {  
    text-decoration: none; font-weight: bold;  
    text-align: center;  
    /*border: 1px solid black;  
    border-left-color: white; border-top-color: white;*/  
    color: #FFFFFF; background-color: #D51D1D;  
    width: 125px;  
  }  
  
  td a:hover {  
    color: #D51D1D; background-color: #FFFFFF;  
    width: 125px;  
    }  
  td a {  
 font: normal 125% Helvetica, Arial, sans-serif;  
    color: #FFFFFF; background-color: #D51D1D;  
    text-decoration: none;  
    font-weight: bold;  
    width: 125px;  
    }  
  td a.active {  
    color: #FFFFFF; background-color: #000000;  
    width: 125px;  
    }  
  
  
#counter {  
float: left;  
color: #FFFFFF;  
}  

Das ist der Quellecode der CSS. Und hier das Menü:

<?php  
  
$navigation1='navigation';  
$navigation2='navigation';  
$navigation3='navigation';  
$navigation4='navigation';  
$navigation5='navigation';  
$navigation6='navigation';  
  
$siteroot='/fanclub/';  
$site1='historie.php';  
$site2='fotos.php';  
$site3='archiv.php';  
$site4='index.php';  
$site5='mitglieder.php';  
$site6='gaestebuch.php';  
$site7='links.php';  
switch ($_SERVER['PHP_SELF'])  
{  
case $siteroot.$site1: $navigation1='active';break;  
case $siteroot.$site2: $navigation2='active';break;  
case $siteroot.$site3: $navigation3='active';break;  
case $siteroot.$site4: $navigation4='active';break;  
case $siteroot.$site5: $navigation5='active';break;  
case $siteroot.$site6: $navigation6='active';break;  
case $siteroot.$site7: $navigation7='active';break;  
}  
echo "  
<div id='counter'>  
<p>Besucherz&auml;hler:</p>  
  
<script language='JavaScript' SRC='Counter'></script>  
  
</div>  
  
<table>  
<tr>  
<td>&nbsp;</td>  
<td><a class='$navigation1' href='historie.php'>Historie</a></td>  
<td>&nbsp;</td>  
<td><a class='$navigation2' href='fotos.php'>Fotos</a></td>  
<td>&nbsp;</td>  
<td><a class='$navigation3' href='archiv.php'>Archiv</a></td>  
</tr>  
<tr>  
<td><a class='$navigation4' href='index.php'>Startseite</a></td>  
<td>&nbsp;</td>  
<td><a class='$navigation5' href='mitglieder.php'>Mitglieder</a></td>  
<td>&nbsp;</td>  
<td><a class='$navigation6' href='gaestebuch.php'>G&auml;stebuch</a></td>  
<td>&nbsp;</td>  
<td><a class='$navigation7' href='links.php'>Links</a></td>  
<td>&nbsp;</td>  
</tr>  
</table>  
";  
  
?>  

[cygnus]

Hallo :)

td a {  }

*display: block* hilft weiter

mfg
cygnus

[Thorsten Schleppi]

Hallo!

Ich habe eine Tabelle für ein Menü. Da der für den ich die Seite mache ein versetztes Menü haben möchte mal oben mal unten. Und mit dem Ausrichten geht es ja nur in Tabellen.

Falsch.

backgroundcolor:red;
backgroundcolor:white;}

Die Eigenschaft heißt background-color.
Vom Einsatz eines Tabellenlayouts rate ich dir ab. Warum kannst du im Forumsarchiv zu genüge erfahren.

Viele Grüße
Thorsten

[MudGuard]

Hi,

td {width:125;

ungültiger Wert (Längeneinheit fehlt)

backgroundcolor:red;

Phantasie-Eigenschaftsnamen.

und a:hover {width:125;
backgroundcolor:white;}

same here - kein Wunder, daß ein vernünftiger Browser nichts davon beachtet.

Im IE 7.x geht es auch einwandfrei

nö, der hält sich nicht an die Regeln - fehlerhafte Deklarationen müssen ignoriert werden.

cu,
Andreas