Abstand zwischen divs. Wie kann ich das vermeiden ?

Versuche mich grade daran, meine Seite auf ein tabellenlos umzuschreiben.

Nun scheitere ich schon am Menü.

hier ein onlinebeispiel: http://3498.kunden.osob.de/cms/

Wieso ist da dieser Abstand zwischen dem Menüimage und den Links im Menü?

Achja , die CSS Sachen stehen nur vorerst direkt im div tag, werden aber noch ausgelagert.

Ich muss dazu sagen, es ist das erste mal , dass ich mich an div und css zusammen versuche, also nicht gleich draufhaun bitte.

Und ist das so sinnvoll, wie ich das bisher mit den div's gemacht habe oder würdet ihr mir eine andere Vorgehensweise vorschlagen ?

Danke schonmal für eure Antworten

mfg Alex

edit:// im Opera wird nochmal mehr zerflückt.

Im IE wirds richtig angezeigt und im FF nicht ganz so schlimm wie im Opera aber auch nicht richtig.

versteh dich nicht ganz aber den Abstand zwischen zwei Sachen machst du entweder mit padding oder margin, wobei man noch die einzelnen Richtungen definieren kann (padding-top, -bottom, -right, -left)

hier zum lesen: http://www.css4you.de/padding.html http://www.css4you.de/margin.html

danke für den Link.
Ich glaube, dass dieser Abstand (zwischen den Bild mit dem Schriftzug "menu" und dem Teil wo sich die Links befinden ) hängt mit dem Menü zusammen, denn wenn ich das rausnehme funzt es richtig....

komisch..


Mit padding-top:1px; gehts irgendwie


edit:// So sieht das ganze bis jetzt aus... http://3498.kunden.osob.de/cms/
Ähm wäre ganz nett wenn ihr mal Kommentare zu dem Code abgeben könnt, wo kann ich kürzen ( CSS Teil wird sowieso noch ausgelagert ) oder divs eventuell besser einsetzen ..

mfg Alex

also grundsätzlich nicht schlecht gemacht... sieht im IE + FF ganz ordendlich aus, ausser beim Menu sieht der middle-align etwas komisch aus.
(navi rechts ist nicht ganz bündig mit dem Logo, absicht?)

was mir aber beim Code auffällt, du hast viele div's mit einem Hintergrundbild aber keinem Inhalt.... die wären meiner Meinung nicht nötig also kannst auch div und dann Bild im div oder noch besser direkt nur Bild machen (wenn du sie floatest und dann <br /> reinmachst hast du den selben Effekt). Das würde dir ein paar Zeichen Code sparen, aber wie gesagt nichts ernstes.

des weiteren frag ich mich wieso hast du zwei mal ein CSS eingebunden, wo doch in beiden das gleiche drinn ist... (habs nur kurz überflogen...)


mfg nic


//ps: nochmals zu deinen leeren div's ich glaube mal gelesen zu haben, dass alte Browser leere div's ignorieren, kann man umgehen indem man ein Leerzeichen hineinmacht. bin mir aber nicht sicher kann mich auch irren...

Original von user-118
Ähm wäre ganz nett wenn ihr mal Kommentare zu dem Code abgeben könnt

- HTML kennt auch andere Elemente als <div>
- Bei deaktiviertem CSS bleibt nur noch die Navigation übrig.. Was ist mit den Überschriften? Die will ich im Textbrowser auch sehen!
- Kein Prolog a la

*{margin:0;padding:0}

Danke schonmal für die Kommentare.
Das mit den Bildern floaten probiere ich gleich mal aus, wäre sicherlich auch übersichtlicher.
Wie soll ich denn die Seite ohne CSS darstellen, meinest du damit , dass ich manche ( die wichtigsten ) Eigenschaften, die in der Style.css später stehen sollen in den "Hauptcode" meiner Index.php schreibe?
Was meinst du mit CSS-Ausfall ? Das die besagte CSS Datei fehlt oder das CSS gänzlich ignoriert wird und somit eine alternative, die ohne CSS auskommt geschaffen werden muss ?

Mfg Alex


edit:// Opera und FF zeigen es richtig an, IE zerhackt es wiedereinmal : http://3498.kunden.osob.de/cms/

nochmal edit:// der Validator haut mir ganz gut Fehler raus : Validator
Aber ich habe absolut keine Ahnung wie ich die zum Donnerwetter wegkriegen kann.

vielleicht weil man den <img> tag nicht so schreibt...??

<img> </img> ist totaler Bullshit :baby:

<img src=".." width="..." height="..." alt="..." /> so sieht ein richtig valider Code aus

Kein CSS-Ausfall, eine Deaktivierung von CSS meine ich. Oder dass gar keine Formatierungen unterstützt werden. Beispiel Textbrowser:

Original von user-162
vielleicht weil man den <img> tag nicht so schreibt...??

<img> </img> ist totaler Bullshit :baby:

<img src=".." width="..." height="..." alt="..." /> so sieht ein richtig valider Code aus

Echt? Ich könnte schwören, dass ich es immer so gesehen habe ...

Joa wie ich das mitn Textbrowser mache, naja da mache ich mir nun noch keine Gedanken drum, sonst werde ich nie fertig

mfg Alex

http://de.selfhtml.org/html/grafiken/einbinden.htm

Semantischer Code ist ganz einfach. Du erstellst ein XHTML Dokument (ohne CSS und "Stylegrafiken", bei dem die Seitenstruktur klar erkennbar sein muss (h1, h2, h3, p, ul, ol, blockquote, ...). Das ganze darfst du erst dann mit CSS ausschmücken -- Plonk!

Jetz wird's aber XHTML hier...

edit:// Gut bei deiner Lösung werden überhaupt keine Bilder angezeigt. bei meiner war es zwar nicht valid , die Bilder wurden aber angezeigt

bist du sicher... ich nehme mal an du hast einen Schreibfehler gemacht

@milahu: was genau ist das für eine Textbrowsersoftware?

Original von user-162

edit:// Gut bei deiner Lösung werden überhaupt keine Bilder angezeigt. bei meiner war es zwar nicht valid , die Bilder wurden aber angezeigt

bist du sicher... ich nehme mal an du hast einen Schreibfehler gemacht

@milahu: was genau ist das für eine Textbrowsersoftware?

Wie du siehst, habe ich den Teil rauseditiert, da es einfach ein Schreibfehler war.

ok dann sind ja alle zufrieden

Original von user-162
was genau ist das für eine Textbrowsersoftware?

Lynx.

Beispiel: http://frankyonline.de/startseite.html*
Und ohne CSS: http://www.webmaster-earth.de/orangebox/unten.php?url=http://frankyonline.de/startseite.html*

ok ich geb zu, ist noch lang nicht alles komplett in der css-datei...aber ich benutze schonmal zumindest <ul> und <hX> ;P

[SIZE=7]*Bloß nicht draufklicken sonst mach ich ja Werbung und das darf ich nicht... *rolleyes*[/SIZE]