Responsive Breakpoints übernehmen werte nicht

1. offizieller Beitrag

    einen wunderschönen guten tag, ich habe ein Problem, ich arbeite gerade an meiner Seite und möchte sie auch Responsive aufbauen.

    Mein Problem ist jetzt dass wenn ich die media mit den Tablet größen bzw PC größen verändere sie sich nicht ändern, egal bei welcher Auflösung, die einzige Lösung wäre ein !important; dran zu setzten aber dies wird dann auch bei den Smartphone Auflösungen geändert.

    @media screen and (max-width: 768px){

    .gis {
    display: none;
    }

    .brandbanner {
    width: 500px;
    height: 63px;

    }

    }

    • Offizieller Beitrag

    Hi,

    I.d.R. liegt sowas an der Priorität. Du solltest versuchen, die Elemente direkter anzusprechen, wenn möglich. Ich kenne Dein DOM nicht, aber allgemein etwa so:

    Code
    @media screen and (max-width: 768px){


    DIV.someClass > SPAN.gis { display: none; }
    DIV.anotherClass > DIV.brandbanner { width: 500px; height: 63px; }


}

    Einfach mal die betroffenen Elemente im Chrome oder Firefox dev tools via inspect anschauen, welche CSS-Regel greift. Diese Regel kann man mit einem genaueren Selektor überschreiben, wie bereits in der Antwort darüber erwähnt.

    Falls !important verwendet wird, kann man das auch nur mit !important überschreiben.

    Infos über Joomla, Webdesign und Co bei sketch.media

    Zitat von Arne Drews

    Hi,

    I.d.R. liegt sowas an der Priorität. Du solltest versuchen, die Elemente direkter anzusprechen, wenn möglich. Ich kenne Dein DOM nicht, aber allgemein etwa so:

    Code
    @media screen and (max-width: 768px){


    DIV.someClass > SPAN.gis { display: none; }
    DIV.anotherClass > DIV.brandbanner { width: 500px; height: 63px; }


}


    Ich bedanke mich! :)