Jean Pascal: Border mit 100% nicht ohne Scrollbar?

Hallo Zusammen,

ich habe ein Problem mit CSS, das aber hier bestimmt jemand leicht zu lösen weiß.

Es ist so, dass ich gerne ein DIV erstellen würde, dass über 100% Breite und Höhe des Browsers geht und einen Border hat.

Nun wird aber - wie das ja wohl normal ist - der Border noch zu den 100% hinzuaddiert, was bedeutet, dass das DIV größer wird, als das Browserfenster (im FF). Wie schaffe ich es aber, das Ganze wirklich nur auf 100% darzustellen (ohne Scrollbar)?

Ich habe mal gelesen, wenn ich ein weiteres DIV drumherum erstelle (ohne Border) würde es funktionieren. Bei mir geht das aber nicht. Wenn das äußere und das innere DIV 100% haben wird dennoch der Border hinzuaddiert.

Hilfe...

Danke und Gruß, Jean

  1. Hallo Jean,

    Es ist so, dass ich gerne ein DIV erstellen würde, dass über 100% Breite und Höhe des Browsers geht und einen Border hat.

    wenn du uns den Sinn verraten würdest, könnte man sich das evtl. besser vorstellen bzw. Lösungsansätze anbieten.

    Nun wird aber - wie das ja wohl normal ist - der Border noch zu den 100% hinzuaddiert, was bedeutet, dass das DIV größer wird, als das Browserfenster (im FF). Wie schaffe ich es aber, das Ganze wirklich nur auf 100% darzustellen (ohne Scrollbar)?

    Gibst du dem Div eine Breite von 100% vor? Wenn dem so sein sollte, nimm die Breite aus deiner CSS-Datei raus, da das Div per default eine Breite von 100% hat (Blockelement).

    Mit freundlichen Grüßen,
    André

    1. Hallo André,

      danke erstmal für die Antwort. Der Sinn ist, dass es für mein Empfinden gut aussieht. Aber die Breite rauszunehmen hat nichts genützt. Die Breite richtet sich bei mir nach dem Inhalt des DIVs. Das DIV geht aber nicht über die gesamte Breite des Browsers, wenn ich keine 100% angebe.

      Gruß Jean

      1. Hallo Jean,

        danke erstmal für die Antwort. Der Sinn ist, dass es für mein Empfinden gut aussieht.

        sieht man einen Unterschied, ob man dem body oder einem Extra-div eine(n) border gibt?

        Mit freundlichen Grüßen,
        André

        1. Hallo André,

          offen gesagt hatte ich garnicht darüber nachgedacht, dass man auch dem body einen border geben könnte. Danke.

          Trotzdem wurmt es mich, dass es nicht mit einem DIV möglich ist.

          Wie schaffe ich es eigentlich, dass ein DIV direkt unter einem anderen DIV angezeigt wird? Mit einem br ist es immer noch nebendran, aber eben etwas tiefer. Das ist jetzt vermutlich eine sehr laienhaft anmutende Frage, aber ich arbeite mich erst richtig in CSS ein. Die Tabellen sollen ganz verschwinden.

          Gruß Jean

          1. Hallo Jean,

            Wie schaffe ich es eigentlich, dass ein DIV direkt unter einem anderen DIV angezeigt wird? Mit einem br ist es immer noch nebendran, aber eben etwas tiefer.

            Das Div-Element ist ein Blockelement und wird automatisch unter einem anderen Div dargestellt (ausser bei Inline-Anweisung oder float). Experimentiere doch mal mit margin-Angaben von 0 bei den untereinander liegenden Divs.

            Das ist jetzt vermutlich eine sehr laienhaft anmutende Frage, aber ich arbeite mich erst richtig in CSS ein. Die Tabellen sollen ganz verschwinden.

            Solange der Ton stimmt, schreibe ich auch mal ganze HTML-/CSS-Grundgerüste. Dein Ton stimmt. Also wirst du hier auch geholfen! ;-)

            Mit freundlichen Grüßen,
            André

            1. Hi André,

              danke für die Infos!

              Gruß Jean

      2. Hallo Jean

        ... Aber die Breite rauszunehmen hat nichts genützt. Die Breite richtet sich bei mir nach dem Inhalt des DIVs. Das DIV geht aber nicht über die gesamte Breite des Browsers, wenn ich keine 100% angebe.

        Welche Eigenschaften hast dem Div denn sonst noch gegeben?

        Ein Blockelement nimmt die gesamte zur Verfügung stehende Breite ein, wenn du
        ihm nicht CSS-Eigenschaften gibst, die dies verhindern.

        Auf Wiederlesen
        Detlef

        --
        - Wissen ist gut
        - Können ist besser
        - aber das Beste und Interessanteste ist der Weg dahin!
        1. Probier mal das einfache Beispiel:

          <?xml version="1.0"?>
          <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
              "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
          <html>
              <head>
                  <title>Titel</title>
                  <meta http-equiv="content-type" content="text/html; charset=UTF-8">
              </head>
              <body style="margin:0;padding:0;">
                  <div style="border:5px solid red;background:#EFE;height:200px;">Div1</div>
                  <div style="border:20px solid blue;background:#FFC;height:200px;">Div2</div>
              </body>
          </html>

          Hier hast du 2 divs untereinander, die die ganze breite einnehmen.

          1. Hallo Jonathan

            Probier mal das einfache Beispiel:
            ...
            Hier hast du 2 divs untereinander, die die ganze breite einnehmen.

            Warum soll _ich_ ein Beispiel probieren, welches genau das zeigt, was ich
            gesagt habe.

            Auf Wiederlesen
            Detlef

            --
            - Wissen ist gut
            - Können ist besser
            - aber das Beste und Interessanteste ist der Weg dahin!
            1. Hallo Detlef,

              danke für dein Posting. Ich habe ein Float: left drin gehabt, deshalb ging es wohl nicht.

              Gruß Jean

            2. Warum soll _ich_ ein Beispiel probieren, welches genau das zeigt, was ich
              gesagt habe.

              Sorry, hab auf das falsche Posting geantwortet. Ich wollte nur deine Behauptung mit einem Beispiel unterstützen.

              mfg Jonathan