Lücke zwischen Bildern

Computer: Software & Programmierung HTML & CSS
#1

habe auf meiner Seite ein Menü erstellt, es besteht aus einem Table und darin sind die Bilder als Backgrounds.
sie sind alle nebeneinander positioniert jedoch ist zwischen den Bildern ein Abstand und ich weiß nicht wieso.

Code

CSS

#navi {
border: none;
padding: 0px;
border-spacing: 0px;
float:left;
width: 985px;
margin: 0 auto;
}
.navi1 {
background: url(Bilder/slice_22.png) top left no-repeat;
}

.navi2 {
background: url(Bilder/slice_23.png) top left no-repeat;
}

.navi3 {
background: url(Bilder/slice_24.png) top left no-repeat;
}

.navi4 {
background: url(Bilder/slice_25.png) top left no-repeat;
}

.navi5 {
background: url(Bilder/slice_26.png) top left no-repeat;
}

.navi6 {
background: url(Bilder/slice_27.png) top left no-repeat;
}

.navi7 {
background: url(Bilder/slice_28.png) top left no-repeat;
}

.navi8 {
background: url(Bilder/slice_29.png) top left no-repeat;
}

.navi9 {
background: url(Bilder/slice_30.png) top left no-repeat;
}

.navi10 {
background: url(Bilder/slice_31.png) top left no-repeat;
}

.navi11 {
background: url(Bilder/slice_32.png) top left no-repeat;
}

link
http://testdesignliga.comlu.com/public/

#2

Mit DIV und TD ineinander hatte ich bisher immer Ärger.
Seitdem nehme ich nur jeweils eins von ihnen.

Gruß JK

#3

Hallo im Forum Fussel86,

-> http://de.selfhtml.org/css/formate/box_modell.htm
-> http://de.selfhtml.org/css/formate/box_modell.htm#w3c

sie sind alle nebeneinander positioniert jedoch ist zwischen
den Bildern ein Abstand und ich weiß nicht wieso.

Versuche über die Angaben zu padding und margin, beide gleich 0, den Abstand klein zu machen.

-> http://de.selfhtml.org/css/formate/einbinden.htm#sep…

Es ist einfacher, oft wiederholende (oder komplette) Angaben/Stylesheets in eine CSS-Datei auszulagern. Es hilft der Lesbarkeit und Wartung, wenn du auch noch:

height=„30“ width=„985“ border=„0“ cellspacing=„0“ cellpadding=„0“>

mit in die CSS-Datei aufnimmst für die Tabelle und die Angaben bei td auch noch auslagerst.

Was mir aber gerade auffällt ist die Sache, dass deine div’s die td’s umschließen, was meiner Meinung nach anders sein sollte:

…Inhalt…

aber ich bin der Meinung auch noch, dass du deine ganzen div Angaben gar nicht brauchst!

Also in der CSS-Datei wird #navi zu table und in der HTML-Datei entfällt …

Dann löscht du auch noch das …

Es kann sein, dass ich auch etwas daneben liege, probiere einfach aus und lies folgendes durch:

-> http://de.selfhtml.org/html/tabellen/aufbau.htm
-> http://de.selfhtml.org/html/grafiken/einbinden.htm
-> http://de.selfhtml.org/css/eigenschaften/hintergrund…

Ich empfehle dir noch die Überprüfung deiner Arbeit:

-> http://validator.w3.org/

Viel Erfolg & Grüße,

Roman

#4

Moin!

habe auf meiner Seite ein Menü erstellt, es besteht aus einem
Table und darin sind die Bilder als Backgrounds.

Der Code ist vollkommen falsch.

  1. Wenn das ein Menü sein soll, dann ist die Auszeichnung falsch. Ein Menü ist eine Liste von Links, daher sollte es auch als Liste ausgezeichnet sein. Mit Tabelle hat das nichts zu tun.
  2. Die divs um die Tabellenzellen sind nicht nur falsch und unsinnig, sie sind auch total überflüssig. Das Element dient dazu, mehrere Elemente zu einer logischen Gruppe zusammenzuführen. Das hast Du hier doch gar nicht vor. Du hast das Element nur eingefügt, um ein Hintergrundbild zu setzen - das ist völlig überflüssig. Das Hintergrundbild hättest Du problemlos auch der Tabellenzelle zuweisen können. Dann sind wir allerdings wieder bei Punkt 1.
  3. Als Menü taugt das ganze Konstrukt nichts, weil da gar keine Menüpunkte sind. Vermutlich hast Du die in den Grafiken drin. Aber jemand, bei dem keine Grafiken angezeigt werden, sieht da gar nichts. Das sind nicht nur Idioten und Spinner oder Modem-Nutzer, die Grafiken ausgeschaltet haben, das sind auch Leute, die einen Textbrowser benutzen, Blinde mit Vorlesebrowsern und auch Suchmaschinen!

Du solltest das alles komplett neu machen, so taugt das für eine Website leider gar nicht.

sie sind alle nebeneinander positioniert jedoch ist zwischen
den Bildern ein Abstand und ich weiß nicht wieso.

Vermutlich wegen Tabellenabständen oder so - aber wenn Du Deinen HTML-Code korrigierst, dann wird das Problem sowieso nicht mehr in der Form bestehen, die Zeit darüber zu grübeln kannst Du Dir also sparen.

Liebe Grüße,
-Efchen

#5

ok danke schön, die Bilder werden alle nebeneinander angezeigt.
Na dann muss ich mal schauen, dass ich es neu mache.

#6

oder Modem-Nutzer, die Grafiken ausgeschaltet haben, … Suchmaschinen!

Wenn Suchmaschinen die Links nicht lesen können, kann das für das Ranking tragisch werden.

Haber gerade einen „Kunden“ der unter diesem Problem leidet.

Liebe Grüße,
JK