• 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

VPS Starter Arubacloud
0 głosów
521 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 (599,730 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 293 wizyt
+1 głos
0 odpowiedzi 268 wizyt
0 głosów
1 odpowiedź 160 wizyt
pytanie zadane 11 marca 2016 w HTML i CSS przez DariuszH Gaduła (3,100 p.)

92,454 zapytań

141,262 odpowiedzi

319,089 komentarzy

61,854 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

Akademia Sekuraka 2024 zapewnia dostęp do minimum 15 szkoleń online z bezpieczeństwa IT oraz dostęp także do materiałów z edycji Sekurak Academy z roku 2023!

Przy zakupie możecie skorzystać z kodu: pasja-akademia - użyjcie go w koszyku, a uzyskacie rabat -30% na bilety w wersji "Standard"! Więcej informacji na temat akademii 2024 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!

...