Meine erste Seite - Bitte noch um Hilfe

[CNE_499cd7]

Hallo alle zusammen,

ich befasse mich seit sehr kurzer Zeit mit Webdesign und habe nach dieser Anleitung ( http://muse-design.de/29-website-tutorial.html ) meine erste Seite fast fertig gestellt.
Zum ersten mal machte ich mich nun mit div-tags und CSS vertraut und werde in der nächsten Zeit mal einige Dokumentationen darüber lesen.
Vorweg: die Seite könnte ihr unter http://70063.webhosting25.1blu.de/first_page.rar herunterladen um den Quelltext und die zugehörigen CSS-Dateien einzusehen.
In der Anleitung wurde beschrieben, wie man eine Navigationsleiste mit RollOver-Effekt erstellen kann. Ich habe es dank SelfHTML geschafft, eine horizontale statt vertikale Navileiste zu erstellen nur dort verzweifelte ich schnell und entschied mich für eine Lösung mit Hilfe einer Tabelle, worüber ich jedoch nur schlechtes gelesen habe (weshalb weiß ich aber noch nicht).
Das Problem ist ganz einfach. Wenn ich das wie im Tutorial mache, kann ich die zwei „leeren Buttons“ links und rechts von der Navileiste nicht einfügen. habe alles probiert, jedoch scheiterte ich kläglich an dieser Aufgabe.
Vielleicht gibt sich eine/r von euch ja einen Ruck und gibt mir ein oder zwei Tips, wie ich das ganze etwas eleganter lösen könnte.
Ich bin SEHR SEHR dankbar für jegliches Feedback, denn nur mit Feedback kommt man doch weiter

Vielen Dank im Voraus und sorry für solch einen endlos langen Text.

[aya]

Hallo CNE,

also vorab mal gratulation!!! - für die erste homepage kann sich das ERgebnis sehen lassen.

und als nächstes ein bisschen Grundsätzliches:
eine HOmepage bzw. den Browserinhalt kann man sich vorstellen wie eine endlose weisse papierrolle. Selbige Papierrolle hat zwar einen fixen Rand oben aber nicht unten.
Innerhalb dieser Papierrolle kann man nun den Text den man reinschreibt gestalten und platzieren. Und mit der Platzierung und Ausrichtung gibts immer wieder mal Probleme, eben weil es keinen unteren Rand gibt.
Hierzu waren vor allem am Anfang der WEb-Ära Tabellen sehr gebräuchtlich, weil man wunderbar Texte und Gestaltungen platzieren konnte. jedoch sind Tabellen nicht dafür gedacht sondern zur Darstellung tabellarischer Daten. Für die Positionierung des Inhaltes sind divs gedacht. Und daher sind Tabellen schlecht und divs gut

Wobei man dazusagen muss, daß wenn ich mit 10 zeilen Tabellencode und 15 minuten Arbeit fertig bin, es sich wohl nicht rechnet divs einzusetzen für deren Ausfertigung ich 2 Tage länger und 3 Workarounds benötige. Also Tabellen sind zwar dafür nicht vorgesehen aber ab und an kann man sich durchaus damit behelfen.

Zu deiner Frage: die versteh ich nicht, denn die beiden Buttons (free_button.jpg) SIND eingefügt und werden angezeigt.
oder sollten die was anderes machen?

lg
aya

[Bei dieser Antwort wurde das Vollzitat nachträglich automatisiert entfernt]

[CNE_499cd7]

Hallo aya,

vielen vielen Dank für die Gratulationen und die umfangreiche Antwort. Das macht einen wirklich glücklich

Nochmal kurz zu meiner Frage: free_button.jpg ist zwar links und rechts eingefügt, jedoch wäre eine Lösung mit div-tags doch sicher besser. Wenn du dir das Tutorial mal ansiehst, mit dem ich die Seite gemacht habe, dann weißt du, wie ich zu Anfang versucht hab die Navi-Leiste zu erstellen. Jedoch konnte ich dort dann links und rechts den free_button.jpg nicht einfügen aus Unwissenheit

Liebe Grüße
CNE

[Bei dieser Antwort wurde das Vollzitat nachträglich automatisiert entfernt]

[aya]

hallo nochmal

ja jetz weiss ich was du meinst! das div mit der id=middle gilt jedoch für den gesamten Bereich ausser dem Header und die Navigation ist NICHT mittels div realisiert sondern über eine „unordered list“ - kurz hier wird eine liste erstellt (

• menüpunkt
  das is gepfriemel für meinen Geschmack und auch unnötiger Aufwand.

Wenn du aber anstatt der Tabelle ein Div machen machen willst, dann bekommt das ganze wieder Hand und Fuß.
Hierfür würde ich ein Div machen mit der gesamten Breite des Headers und die images im Div so ausrichten wie sie sein sollen.
wie z.B.
#navi img{padding-right:10px}
um den Abstand zwischen den einzelnen Buttons einzufügen.
Hierbei werden nur images berücksichtigt, die sich im Element mit der Id navi befinden.

Der Quelltext würde wie folgt ausschauen:

**************hier die anderen links************

Du hast ja hab ich grade eben gesehen auch noch in den Tabellenzellen divs gemacht, das muss nicht sein!

glg
aya

Hallo aya,

vielen vielen Dank für die Gratulationen und die umfangreiche
Antwort. Das macht einen wirklich glücklich

Nochmal kurz zu meiner Frage: free_button.jpg ist zwar links
und rechts eingefügt, jedoch wäre eine Lösung mit div-tags
doch sicher besser. Wenn du dir das Tutorial mal ansiehst, mit
dem ich die Seite gemacht habe, dann weißt du, wie ich zu
Anfang versucht hab die Navi-Leiste zu erstellen. Jedoch
konnte ich dort dann links und rechts den free_button.jpg
nicht einfügen aus Unwissenheit

Liebe Grüße
CNE

[CNE_499cd7]

Oh Wow!! Vielen lieben Dank. Das ist ja echt super, dass du dir solche Mühe gegeben hast. Jetzt scheint es viel einfacher als zuerst gedacht. Eine Sache habe ich geändert. Du hast im CSS ein padding-right:10px eingefügt. Dann gilt der Border aber auch für die 10px, daher ist doch margin-right richtig, oder?
Wozu eigentlich das prehtml? Kannte den Befehl eher für Texttabellen.
Ein Problem hab ich noch. Nun passt zwar alles soweit, jedoch verschiebt sich der rechte Free_Button eine Zeile tiefer. Das liegt sicher daran, dass er danach ja auch nochmal 10px einfügt ganz rechts und sich dadurch ein Zeilenumbruch bildet, kann das sein?

Nochmal vielen vielen lieben Dank. Ich finde das echt grandios, dass du dir diese Mühe gemacht hast und lass mich bitte wissen, wie ich mich dafür revanchieren kann.

Schöne Grüße aus der Hauptstadt
CNE

[Bei dieser Antwort wurde das Vollzitat nachträglich automatisiert entfernt]

[aya]

Hi

Wegen dem padding/margin --> ja natürlich hast du da recht - ich hab beim rumbasteln keine Border verwendet und … egal.

Prehtml --> woher hast du das? das ist hier für das Forum, wenn man code postet, kann es sein, daß er interepretiert wird also **ist dann auch fett - damit aber nur der text ersichtlich ist --> prehtml.
Unmittelbar unter dem Eingabefeld für Posts siehst du möglichen tags.
http://www.wer-weiss-was.de/faq/entry30.html

Und verschieben tut sich der letzte Button weil er keinen Platz mehr hat, geh ev. mit dem !!margin auf 9px runter oder mach die beiden free_buttons kleiner. Das passiert weil das Div (die Tabelle ??) eine fixe breite hat und alles was nicht in eine Zeile passt wird einfach in die nähcste geschrieben.

Und ja gern- freuts mich wenn es geholfen hat. Revenchieren wirst du dich wohl automatsch mal zu einem anderen Thema bei dem ich dann grad starte

lg
aya

Oh Wow!! Vielen lieben Dank. Das ist ja echt super, dass du
dir solche Mühe gegeben hast. Jetzt scheint es viel einfacher
als zuerst gedacht. Eine Sache habe ich geändert. Du hast im
CSS ein padding-right:10px eingefügt. Dann gilt der Border
aber auch für die 10px, daher ist doch margin-right richtig,
oder?
Wozu eigentlich das prehtml? Kannte den Befehl eher für
Texttabellen.
Ein Problem hab ich noch. Nun passt zwar alles soweit, jedoch
verschiebt sich der rechte Free_Button eine Zeile tiefer. Das
liegt sicher daran, dass er danach ja auch nochmal 10px
einfügt ganz rechts und sich dadurch ein Zeilenumbruch bildet,
kann das sein?

Nochmal vielen vielen lieben Dank. Ich finde das echt
grandios, dass du dir diese Mühe gemacht hast und lass mich
bitte wissen, wie ich mich dafür revanchieren kann.

Schöne Grüße aus der Hauptstadt
CNE**