• Najnowsze pytania
  • Bez odpowiedzi
  • Zadaj pytanie
  • Kategorie
  • Tagi
  • Zdobyte punkty
  • Ekipa ninja
  • IRC
  • FAQ
  • Regulamin
  • Książki warte uwagi

@media(max-width: ) - reaguje tylko od pewnej rozdzielczości

Object Storage Arubacloud
0 głosów
551 wizyt
pytanie zadane 19 grudnia 2020 w HTML i CSS przez vingilot85 Obywatel (1,150 p.)
Jak w tytule.
Próbuję ogarnąć responsywność, ale header ustawiony na 100% szerokości, przy @media(max-width: ) reaguje dopiero od dokładnie 980px w górę. Jak zrobię max-width: 979px i mniej, nie ma reakcji.

Wie ktoś dlaczego tak się może dziać?
komentarz 19 grudnia 2020 przez Comandeer Guru (600,810 p.)
Pokaż kod.
komentarz 19 grudnia 2020 przez vingilot85 Obywatel (1,150 p.)
<div class="container">
	<header>
		<div class="width-1000px">
			<a href="index.html">
				<div class="logo_medium">
					<img src="pic/motylarnia-logo-transp.png" width="180pt"/>
				</div>
			</a>
			<nav id="nav_header">
				<ul>  <!--pozycje li są w odwrotnej kolejności, dlatego, że na stronie float:right ustawi je w kolejności od prawej-->
					<a href="#kontakt"><li>Kontakt</li></a>
					<a href="#zakonczone_projekty"><li>Zakończone projekty</li></a>
					<a href="#projekty"><li>Projekty</li></a>
					<a href="#placowka"><li>Placówka - Motylarnia Ośrodek Terapii</li></a>
					<a href="#zespol"><li>Zespół</li></a>
					<a href="#misja"><li>Misja</li></a>
				</ul>
			</nav>
			<div style="clear:both;"></div>
		</div>
	</header>
.container
{
	width:100%;
}
.width-1000px
{
	width:1000px;
	margin:0 auto 0 auto;
}

header
{
	width:100%;
	background-color:rgba(255, 255, 255, 0.8);
	position: -webkit-sticky; /* Safari */
	position: -moz-sticky;
	position: sticky;
	top: 0;
	z-index:100;
}

@media (max-width:720px)
{
	header
	{
		background-color:#aaa;
		
	}
}

Proszę

1 odpowiedź

0 głosów
odpowiedź 20 grudnia 2020 przez CubeStorm Pasjonat (15,020 p.)
Możesz jeszcze raz wytłumaczyć dokładnie co Ci nie działa? Twój kod u mnie działa prawidłowo.
komentarz 20 grudnia 2020 przez vingilot85 Obywatel (1,150 p.)
@media (max-width: XXpx ) nie reagował, kiedy wartość w px była poniżej 980.
Ale dzisuaj nagle z dupy zaczęło wszystko działać jak należy, mimo, że nie wprowadziłem żadnych zmian...
Mimo to dzięki za odzew

Podobne pytania

0 głosów
3 odpowiedzi 305 wizyt
+1 głos
0 odpowiedzi 271 wizyt
0 głosów
1 odpowiedź 161 wizyt
pytanie zadane 11 marca 2016 w HTML i CSS przez DariuszH Gaduła (3,100 p.)

92,551 zapytań

141,393 odpowiedzi

319,523 komentarzy

61,936 pasjonatów

Motyw:

Akcja Pajacyk

Pajacyk od wielu lat dożywia dzieci. Pomóż klikając w zielony brzuszek na stronie. Dziękujemy! ♡

Oto polecana książka warta uwagi.
Pełną listę książek znajdziesz tutaj.

Akademia Sekuraka

Kolejna edycja największej imprezy hakerskiej w Polsce, czyli Mega Sekurak Hacking Party odbędzie się już 20 maja 2024r. Z tej okazji mamy dla Was kod: pasjamshp - jeżeli wpiszecie go w koszyku, to wówczas otrzymacie 40% zniżki na bilet w wersji standard!

Więcej informacji na temat imprezy znajdziecie tutaj. Dziękujemy ekipie Sekuraka za taką fajną zniżkę dla wszystkich Pasjonatów!

Akademia Sekuraka

Niedawno wystartował dodruk tej świetnej, rozchwytywanej książki (około 940 stron). Mamy dla Was kod: pasja (wpiszcie go w koszyku), dzięki któremu otrzymujemy 10% zniżki - dziękujemy zaprzyjaźnionej ekipie Sekuraka za taki bonus dla Pasjonatów! Książka to pierwszy tom z serii o ITsec, który łagodnie wprowadzi w świat bezpieczeństwa IT każdą osobę - warto, polecamy!

...