aux: Problem mit der Breitenangabe

Moin,

ich versuch mich zur Zeit grade von den veralteten Table-Layouts loszumachen und das nun alles mit CSS zu gestalten.

Ich hab jetzt verschiedene DIVs in meinem HTML-Quelltext. Über meine .css-Datei habe ich die Position, Breite, etc. festgelegt.

Jetzt aber mein Problem: Wenn ich möchte, dass ein DIV erst ab left:10px anfängt und sich bis zum Ende des Bildschirmrandes erstreckt... wie mache ich das?

Ich habe versucht, 100% als Breite zu setzen... aber er scheint immer die gesamte Bildschirmbreite als 100% zu nehmen und wenn das Teil vom linken Rand 10px entfernt ist, ragt es entsprechend rechts 10px aus dem Bildschirm raus. Das ist ja auch logisch, aber eben nicht gewollt.

Wie mache ich es, dass er nur bis zum sichtbaren Bildschirmrand auffüllt und NICHT darüber hinaus?

greetz
aux

  1. Hi

    ich versuch mich zur Zeit grade von den veralteten Table-Layouts loszumachen und das nun alles mit CSS zu gestalten.

    Ich hab jetzt verschiedene DIVs in meinem HTML-Quelltext. Über meine .css-Datei habe ich die Position, Breite, etc. festgelegt.

    Jetzt aber mein Problem: Wenn ich möchte, dass ein DIV erst ab left:10px anfängt und sich bis zum Ende des Bildschirmrandes erstreckt... wie mache ich das?

    width:100%; margin-left:10px; (oder wars padding-left?)

    Andreas

    1. width:100%; margin-left:10px; (oder wars padding-left?)

      Nein, das Resultat scheint das gleiche zu sein.

      Hier mein CSS:

      #layout3 {
        position: absolute;
        top: 18px;
        border: solid 0px black;
        margin: 0px;
        margin-left: 10px;
        padding: 0px;
        background-color: #cccccc;
        width: 100%;
        height: 50px;
        }

      Und das Teil ragt genau 10px nach rechts aus dem Bildschirm-Rand raus :-S

      1. Hallo,

        versuch doch mal:

        #layout3 {
          border: solid 0px black;

        margin: 18px 0 0 10px;

        padding: 0px;
          background-color: #cccccc;
          height: 50px;
          }

        Wenn du keine Breite angibst, sollte das automatisch passen.

        Gruß, Jan

        P.S. Warum eigentlich "border: solid 0px black;"?

        1. #layout3 {
            border: solid 0px black;
          margin: 18px 0 0 10px;
            padding: 0px;
            background-color: #cccccc;
            height: 50px;
            }

          Wenn du keine Breite angibst, sollte das automatisch passen.

          Danke, das hat geklappt :)

          P.S. Warum eigentlich "border: solid 0px black;"?

          Naja, weil ich damit um die DIVs einen Rahmen machen kann... da ich die CSS-Befehle aber nicht so gut kenne, mach ich den Rahmen einfach schwarz und 0 Pixel, wenn ich ihn nicht brauche... und wenn ich ihn brauche, änder ich einfach die Farbe und die Breite des Rahmens ;)

          Greetz
          aux

          1. Hallo aux,

            Naja, weil ich damit um die DIVs einen Rahmen machen kann... da ich die CSS-Befehle aber nicht so gut kenne, mach ich den Rahmen einfach schwarz und 0 Pixel, wenn ich ihn nicht brauche... und wenn ich ihn brauche, änder ich einfach die Farbe und die Breite des Rahmens ;)

            border:solid 0px black; <-- '0px' könnte in manchen Browsern Probleme machen.
            Verwende doch einfach   border:none;   das ist AFAIK auch w3c konform.

            Grüße aus Nürnberg

            HarryS

  2. <div style="margin-left:10px; width:100%">Inhalt</div>

    Würd mich mal interessieren ob das geht...