Willkommen in der Webstatt Zum Webstatt Blog und Stories
Al3x0r Al3x0r am 22.05.06 21:11

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.

netcup.de Warum gibt es hier Werbung?
der_nic der_nic am 22.05.06 21:22

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

Al3x0r Al3x0r am 22.05.06 21:25

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

der_nic der_nic am 23.05.06 15:47

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...

milahu milahu am 23.05.06 17:30

Quote
Original von Al3x0r
Ä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}

Al3x0r Al3x0r am 23.05.06 18:04

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.

der_nic der_nic am 23.05.06 20:15

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

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

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

milahu milahu am 23.05.06 20:18

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

Al3x0r Al3x0r am 23.05.06 20:20

Quote
Original von der_nic
vielleicht weil man den <img> tag nicht so schreibt...:D??

<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 :D

mfg Alex

milahu milahu am 23.05.06 20:27

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... ;)

der_nic der_nic am 23.05.06 20:29

Quote
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?

Al3x0r Al3x0r am 23.05.06 20:43

Quote
Original von der_nic
[QUOTE]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?[/quote]

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

der_nic der_nic am 23.05.06 20:44

ok dann sind ja alle zufrieden:)

milahu milahu am 23.05.06 21:25

Quote
Original von der_nic
was genau ist das für eine Textbrowsersoftware?

Lynx.

Franky Franky am 23.05.06 22:07

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]

Creative Commons Lizenzvertrag
Alle Inhalte des Webstatt-Archivs stehen unter einer Creative Commons Namensnennung - Weitergabe unter gleichen Bedingungen 3.0 Unported Lizenz.

Impressum & Kontakt