Responsive Breakpoints übernehmen werte nicht

IAMZHC

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;

}

}

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; }


}

sketch.media

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.

IAMZHC

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!

Tags