• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

problem mit rollover

Status
Für weitere Antworten geschlossen.
C

Conti93

Neues Mitglied
moin moin,
weis nich ob das hier richtig ist, falls nich bitte nach css veschieben.
Ich hab mir ne seite gebastelt als projekt für informatik damit ich ne 1 kriege und ich bin nun fast fertig aber ein problem gibts da noch. die .css sieht so aus:
HTML: 
#arbeitsspeicher a {
    height: 24px;
    width: 130px;
    display: table-cell;
    background: url("../buttons/Arbeitsspeicher.png") 0px 0px no-repeat;
    }

#arbeitsspeicher a:hover {    
    background-position: 0px -24px;
    }


#prozessor a {
    height: 24px;
    width: 130px;
    display: table-cell;
    background: url("../buttons/Prozessor.png") 0px 0px no-repeat;
    }

#prozessor a:hover {
    background-position: 0px -24px;
    }


#grafikkarte a {
    height: 24px;
    width: 130px;
    display: table-cell;
    background: url("../buttons/Grafikkarte.png") 0px 0px no-repeat;
    }

#grafikkarte a:hover {
    background-position: 0px -24px;
    }


#festplatte a {
    height: 24px;
    width: 130px;
    display: table-cell;
    background: url("../buttons/festplatte.png") 0px 0px no-repeat;
    }

#festplatte a:hover {
    background-position: 0px -24px;
    }


#laufwerke a {
    height: 24px;
    width: 130px;
    display: table-cell;
    background: url("../buttons/Laufwerke.png") 0px 0px no-repeat;
    }

#laufwerke a:hover {
    background-position: 0px -24px;
    }


#mainboard a {
    height: 24px;
    width: 130px;
    display: table-cell;
    background: url("../buttons/Mainboard.png") 0px 0px no-repeat;
    }

#mainboard a:hover {
    background-position: 0px -24px;
    }


#netzteil a {
    height: 24px;
    width: 130px;
    display: table-cell;
    background: url("../buttons/Netzteil.png") 0px 0px no-repeat;
    }

#netzteil a:hover {
    background-position: 0px -24px;
    }
und die html so:

HTML: 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>

<head>
    <title>navi</title>
    <link href="rollover.css" type="text/css" rel="stylesheet" />
    
    <meta http-equiv="content-type" content="text/html; charset=ISO-8859-1" />
    <meta name="generator" content="Webocton - Scriptly (www.scriptly.de)" />

</head>

<body bgcolor="#0F1C29">
<br /><br /><br />
<table border="0" cellpadding="2" cellspacing="2" summary="" width="200">
    <tr>
        <td>
        <div id="arbeitsspeicher">
        <a href="arbeitsspeicher.htm" target="main"></a>
        </div> 
        </td>
    </tr>
    <tr>
        <td>
        <div id="prozessor">
        <a href="prozessor.htm" target="main"></a>
        </div>
        </td>
    </tr>
    <tr>
        <td>
        <div id="grafikkarte">
        <a href="grafikkarte.htm" target="main"></a>
        </div>         
        </td>
    </tr>
    <tr>
        <td>
        <div id="festplatte">
        <a href="festplatte.htm" target="main"></a>
        </div>
        </td>
    </tr>
    <tr>
        <td>
        <div id="laufwerke">
        <a href="laufwerke.htm" target="main"></a>
        </div>
        </td>
    </tr>
    <tr>
        <td>
        <div id="mainboard">
        <a href="mainboard.htm" target="main"></a>
        </div>
        </td>
    </tr>
    <tr>
        <td>
        <div id="netzteil">
        <a href="Netzteil.htm" target="main"></a>
        </div>
        </td>
    </tr>
</table>
  
</body>
</html>
Im firefox und Opera geht das wunderbar aber im IE gehts nich auser in der neuen 8 Beta.
Da ich davon wirklich nicht viel Ahnung habe bitte ich euch einfach nen codeschnipsel so zu ändern das es gehen würde sonst versteh ich das wieder nich:cry:

thx im voraus
 
hm vllt. schreibt ja nur keiner weils nich verstanden wird...
also nochmal
Die Bilder (also die links) werden in Firefox, Opera und dem IE8 Beta so angezeigt wie sie das sollen, sie verschieben sich auch, alles kein Thema aber im IE 5-7 (habs nur da getestet) werden die bilder nicht mal angezeigt.
Weis das wer ne Lösung für, oder gibts vllt noch andere rollover techniken?
 
Conti93 schrieb:
Ich hab mir ne seite gebastelt als projekt für informatik damit ich ne 1 kriege
Zum Vergrößern anklicken....
Entschuldige, aber ich komm nicht umhin zu fragen, für was Du bei DEM Code eine 1 kriegen solltest? Sicher nicht für den HTML-Code, denn der ist jenseits von Gut und Böse. Der Code kann nur mit 6, Begründung "HTML nicht verstanden" bewertet werden.

Wenns Dich interessiert, erklär ich es Dir.
 
Conti93 schrieb:
und was ist daran falsch? funktioniert doch fast alles.
Zum Vergrößern anklicken....
Vielleicht in Deinem Browser. Aber es gibt noch mehr Browser und es gibt Clients, die keine Browser sind, also solche, die nichts visualisieren. Die sind auf einen validen und semantisch korrekten HTML-Code angewiesen. Und von Semantik ist bei Dir leider keine Spur.

1. Du mischst Inhalt mit Layout. HTML ist nicht für Layout/Design gedacht. Alles, was mit dem Optischen zu tun hat, soll in ein externes Stylesheet. Dazu gehören auch Attribute wie "bgcolor" oder Tags wie <br>.

2. Du zeichnest Deinen Inhalt als Tabelle aus, ohne aber tabellarische Daten zu haben. Das ist falsche Semantik. Bei HTML geht es darum, dem Inhalt eine Bedeutung zu geben. Dein Code ist aber ein Menü und ein Menü ist keine Tabelle, sondern eine Liste. Also sollte es als Liste (<ul>) ausgezeichnet werden. Clients, die die HTML-Struktur interpretieren, glaube jetzt, dass da tabellarische Daten kommen, was ja nicht der Fall ist. Im ungünstigsten Falle wird sowas dann falsch verarbeitet, d.h. Suchmaschinen speichern den Inhalt anders, als er gemeint ist und Vorlesebrowser lesen Unfug vor.

3. Du packst jeden Link in ein allgemeines Block-Element. Das Element <div> dient zum Gruppieren mehrerer Elemente, in der Regel zwecks gemeinsamer Formatierung. Bei Dir enthält das div aber nur ein Element. Das div ist also überflüssig. Das ist gut vergleichbar mit Geschenken. So, wie Du es hier hast, ist das vergleichbar damit, wenn Du ein Geschenk zweimal in Papier einwickelst. Das macht normalerweise keiner. Aber in HTML machen es unsinnigerweise sehr viele.

Im IE könnte übrigens das display:table-cell für Probleme sorgen, dass er zumindest bis Version 6 IIRC nicht interpretiert.

Grüße,
-Efchen
 
Status
Für weitere Antworten geschlossen.

Neueste Beiträge

Zurück
Oben