Beiträge von sejuma

    Das kommt auf deine Datei- und Ordnerstruktur an.
    Befindet sich die CSS-Datei im gleichen Ordner wie die html-Dateien, dann lautet der Pfad so:

    Code
    <link rel="stylesheet" type="text/css" href="default.css">

    Hast du die Datei in einem speziellen Ordner, z.B. im Ordner "css", dann wäre - wenn sich dieser Ordner im gleichen Verzeichnis wie die html-Dateien befindet - folgender Pfad anzugeben:

    Code
    <link rel="stylesheet" type="text/css" href="css/default.css">

    Der Pfad geht also vom Standort der html-Dateien aus zu der CSS-Datei.

    Den o.g. Code dann innerhalb des head-Bereiches einfügen.

    Mal ein paar grundsätzliche Überlegungen, ohne jetzt eine Gesamtlösung parat zu haben:

    Wenn du eine Breite von 70% verwendest (oder auch ein beliebiger anderer Prozentwert):
    Dann ist doch die Navi je nach Bildschirmbreite ebenfalls immer unterschiedlich breit. Andere Bildschirme --->> andere Navibreiten.
    Die Links haben aber eine feste Breite.
    Folge: Sie werden immer in unterschiedliche (prozentuale) Gesamtbreiten eingebunden und können so nie richtig zentriert sein oder der prozentuale Platz reicht noch nicht mal aus, um sie nebeneinander darzustellen.

    Deshalb folgender Lösungsansatz:
    Verwende für die Navi feste Pixelwerte.
    Ich hatte in einem anderen Zusammenhang mal was ähnliches gebastelt und da ist etwas Rechenarbeit angesagt:
    Zunächst ermittelst du die Anzahl der Links. Diesen gibst du eine bestimmte, einheitliche Pixelbreite. Unter Berücksichtigung von evtl. Border-, Margin- und Paddingwerten ermittelst du die Gesamtbreite der einzelnen Links.
    Diese verwendest du für ul. Und ul zentrierst du in dem Navi-Div.

    Ich poste hier mal dieses Beispiel, das du dann an deine spezifischen Verhältnisse mit anderen Pixelwerten anpassen müsstest.

    CSS:

    HTML

    Code
    <div id="navi"> 
        <ul> 
          <li style="border-left: 1px solid #4D4D4D;">[url='index.html']Home[/url] 
          [*][url='link1.html']Link 1[/url] 
          [*][url='link2.html']Link 2[/url] 
          [*][url='link3.html']Link 3[/url] 
        [/list] 
      </div>

    Ohne Gewähr, weil ich nicht alles nachvollziehen kann bzw. nicht an die Dateien komme:

    In deiner Index.htm steht ziemlich oben folgendes:

    Code
    <body background="image/BG.JPG"> <body style= background-attachment:fixed>

    Das ersetze mal komplett damit:


    Code
    <body style="background: #000 url(image/BG.JPG) no-repeat; background-attachment:fixed;">

    Dadurch soll das Hintergrundbild nur einmal angezeigt werden. Sofern überflüssiger Platz vorhanden, wird dieser schwarz dargestellt.
    Falls es nicht klappt, mach's wieder rückgängig.

    Da gibt es unterschiedliche Ansätze:

    Die Wiederholung kannst du unterdrücken mit der CSS-Angabe

    Code
    background-repeat: no-repeat;

    Ich vermute, dass du das Hintergrundbild in den Body eingebunden hast.
    Falls ja, könntest du es stattdessen in einen allumfassenden Div packen, der z.B. der Größe des Bildes entspricht.

    Dann kommt es auf die Art der Grafik an:
    Zunächst solltest du sie komprimieren. Selbst 500kb sind bereits sehr groß.
    Wenn es nicht unbedingt auf den kompletten Bereich der Grafik ankommt, ist vielleicht auch das eine Variante: http://www.ohne-css.gehts-gar.net/0030.php

    Am besten wäre ein Link, so dass man sich das mal konkret ansehen kann.
    :wink:

    Probier's mal so;

    Code
    [img]deinbild.jpg[/img]


    Bei width und height setze die entsprechenden Grafikwerte ein.

    Edit:
    Geht auch noch viel einfacher:

    Code
    [img]deinbild.jpg[/img]

    Sieht (im IE7) ziemlich verschoben aus.
    Du solltest dem #all eine feste Breite geben, sonst füllt er die Gesamtbreite aus und ist somit überflüssig.
    Das "position:relative;" beim #all ist unnötig.

    Irgendwie passt das nicht zusammen bzw. allenfalls an deinem PC wo du die Seite entwickelst:
    Du verwendest für den body ein Hintergrundbild. Das hat fest definierte Pixlewerte (Höhe und Breite).
    Für deine Div's nimmst du dann Prozentwerte. Die sind abhängig von den unterschiedlichen Bildschirmgrößen und können somit an jedem PC unterschiedlich sein.
    Folge: Hintergrundbild und die einzelnen Elemente können wegen der unterschiedlichen Einheiten nicht zusammenpassen. In so einem Fall wäre ein fixes Layout vermutlich die bessere Lösung.
    Für die Navi selbst würde ich eine Listennavi verwenden. Beispiele siehe hier:
    http://css.maxdesign.com.au/listamatic/
    Gut wäre es, wenn man sich die Page mal direkt per Link ansehen könnte.

    Dein #scrollbereich wird doch immer gleich angezeigt: Immer 208px vom oberen und 258px vom linken Rand entfernt.

    Möglicherweise willst du ihn jedoch nur zentriert darstellen. Das geht horizontal unproblematisch. Vertikal müsste der Div eine bestimmte Pixelhöhe haben.

    Ich empfehle dir, auf alle absoluten Positionsangaben zu verzichten.
    Verwende besser margin-Angaben und für nebeneinander angeordnete Div's float.

    Wenn du eine horizontale Zentrierung anstrebst, die in allen Auflösungen gleich aussieht, dann sieh dir mal diese Anleitung an. Für zusätzlich vertikal evtl. noch diese.

    Füge das vor </head> ein:

    Code
    <style type="text/css">
    body {margin: 0; padding: 0;}
    </style>

    Ferner:
    Der center-Tag muss innerhalb des body stehen.
    Das

    Code
    <div style="padding:0" style="margin:0" style="margin-left:0" style="margin-top:0">

    ist vollkommen unnötig.