Breite des Content-Bereichs größer

  • Hallo,


    schaut euch doch bitte meinen neuen Stil für das Traumprojekt mal an. Der Content-Bereich ist in der mobilen Ansicht warum auch immer etwas schmaler, als die Boxen darunter, und genau dieses „warum auch immer“ wäre meine Frage. Was verursacht das? Ich hätte da links und rechts gerne keinen Abstand. Vielen Dank im Voraus für eure Hilfe. :)



    Beste Grüße


    Gerhard

  • Code
    @media (max-width: 1024px)
    .main .layoutBoundary {
        padding: 0px;
    }

    Normal gibt es dort 10px padding und mit 0px sollte Inhalt bis zum rand gehen.


    -edit-

    .main hinzugefügt damit die anderen .layoutBoundary nicht betroffen sind.

  • .layoutBoundary hat bei dir ein Padding von 10 Pixeln zu den Seiten. Dadurch gibt es am Rand eben einen Rand von 10 Pixeln:

    CSS
    @media (max-width: 1024px) {
        .layoutBoundary {
            padding: 0 10px;
        }
    }


    Für die Boxen .sidebar hast du zusätzlich folgende Anweisung drin:

    CSS
    @media (max-width: 1024px) {
        .sidebar {
            margin: 0 -10px;
        }
    }

    Das -10px gleicht das mit dem Rand wieder aus und schiebt das komplett an den Rand des Browsers. 10 Pixel Rand minus 10 Pixel = 0 Pixel. Für den Content hast du diese Anweisung aber nicht drin. Da gibt es also weiterhin den Rand.


    Wenn du den Rand beim Content ebenfalls weg haben willst, kannst du entweder...


    1. das padding von .layoutBoundary und das margin von .sidebar beides auf 0 setzen


    ...oder alternativ...


    2. für den Content das selbe machen wie für die Sidebar:


    CSS
    @media (max-width: 1024px) {
        .content {
            margin: 0 -10px;
        }
    }



    Edit:

    Code
    @media (max-width: 1024px)
        .layoutBoundary {
            padding: 0px;
        }

    Normal gibt es dort 10px padding und mit 0px sollte Inhalt bis zum rand gehen.

    Dann wäre seine Sidebar aber -10 Pixel nach außen verschoben und deshalb am Rand abgeschnitten. Das müsste er dann halt auch anpassen.

Participate now!

Don’t have an account yet? Register yourself now and be a part of our community!