Responsive Design Seitennavigation

  • Guten Abend zusammen,

    ich habe aktuell ein 3 Spalten Layout. Links ein kleines, schmales Menü wo ein paar Informationen angezeigt werden.

    In der Mitte befindet sich der eigentliche Content mit den Nachrichten.

    Rechts befindet sich ebenfalls eine schmale Seitenbox mit ein paar Infos.


    Wenn ich mit dem Smartphone auf die Seite gehe, sehe ich den mittleren Content. Links und rechts die beiden Boxen werden ausgeblendet.


    Wie kann ich die wieder einblenden?


    Grüße und vielen Dank!

    Sascha

  • Oh, tut mir Leid.


    Jommla: aktuelle 3.9.18



    Das Design ist von einer Firma erstellt worden. Mittlerweile habe ich selbst die Verwaltung übernommen und bin dabei mich in Joomla einzuarbeiten.


    Edit by Admin: Link auf Userwunsch gelöscht.

  • Es gibt eine CSS-Anweisung:


    CSS
    @media screen and (max-width: 768px) {
    #box_links {
        display: none !important;
    }
    }

    Heißt also, blende die linke Spalte bis 768px aus. Etwas darüber 769 Pixel+ hast die linke Spalte als ziemlich großen Block über dem Haupt-Bereich, bis sie dann nach links rutsch ab ichweißnicht Pixel.


    Die rechte Spalte rutscht übrigens ganz ans Ende der Seite. Ist also noch da. Bekommt allerdings Mikroschrift.


    Spiel mal im Firefox mit Extras > Web-Entwickler > "Bildschirmgrößen testen" rum.


    Andere Browser haben ähnliche Werkzeuge drinnen.

  • Sehr schön, vielen Dank für den ersten Ansatz!


    Eine Frage hätte ich noch dazu. Diese Anweisung steht in der Bootstrap.css die man, wenn ich es richtig verstanden habe, nicht bearbeiten sollte. Überschreibt das System diese Anweisung, wenn ich sie in eine andere css schreibe?

    Oder soll ich einfach die bootstrap.css bearbeiten?

  • Ich habe die in der template.css gefunden. Mein Code-Block ist auch etwas irreführend. Zwischen Zeile 1 und 5 stehen viele weitere Anweisungen. Irgendwann dann die besagten.


    Dass Zeile 1 auch in bootstrap.css steht, liegt einfach daran, dass das eine Standardzeile in responsivem CSS ist. Divers zu finden mit unterschiedlichsten Pixel-Werten, die (im Normalfall) dann die so genannten "Breakpoints" repräsentieren.