webForumDet fria alternativet

Responsive media queries

HTML & CSSur HTML, XHTML & CSS

2 svar · 747 visningar · startad av AndersSkold

Medlem sedan maj 20122 inlägg
Frågan#1

Hej

Jag sitter och testar lite responsive webbdesign.
Jag undrar om det är så att om man väljer Margin-top 5% på ett objekt för typ min-width 480 så blir det även på 768 queries, då måste jag sätta även Margin-top 0 för den, är det alltid så? Eller har jag gjort något fel?

Medlem sedan jan. 2003296 inlägg
#2

Hej!

Ja, flera mediaqueries kan matchas samtidigt. Är webbläsarfönstret exempelvis 1000px brett så är ju fönstret både minst 480px och minst 768px, så det är logiskt att båda dina mediaqueries används om du bara begränsar med min-width.

Det går att lägga till ytterligare begränsningar dock:

@media screen and (min-width: 480px) and (max-width: 767px) {
	...
}

@media screen and (min-width: 768px) {
	...
}

Då används inte de båda blocken samtidigt.

Medlem sedan maj 20122 inlägg
#3

Tackar

158 ms totalt · 3 externa anrop · v20260731065814-full.b746b907
0 ms — hämta forumlista (cache)
0 ms — hämta statistik (cache)
156 ms — hämta tråd, inlägg och bilagor (db)