Ukrycie diva przy określonej rozdzielczości

pytanie zadane 13 lutego w HTML i CSS przez zbiku25 Bywalec (2,940 p.)

Cześć,

Próbuję za pomocą CSS ukryć div ze zdjęciem (half-second), kiedy rozdzielczość ekranu jest niższa niż 351px. Niestety div nie znika tylko przesuwa się pod spód:(

Czy jest ktoś w stanie podpowiedzieć mi co robię źle?
Poniżej kod CSS

@media screen and (min-width:351px)
{
	.half-second img
	{
		height: auto; 
		width: 100%; 
		z-index:-50;
		margin-top:-30px;

	}
	
	.half-second
	{

		display:flex;
		align-items:center;
		width:50%;
	}
}

@media screen and (max-width:350px)
{
	.half-second img
	{
		display:none;
		visibility:hidden;

	}
	
	.half-second
	{

		display:none;
		visibility:hidden;

	}
}

komentarz 13 lutego przez Fiji404 Nowicjusz (200 p.)

to są twoje wszystkie style CSS ?

komentarz 13 lutego przez VBService Ekspert (246,010 p.)

@zbiku25, Sprawdź

[ on-line ]

@media screen and (max-width:350px)
{
  .half-second
  { 
    display:none; 
  }
}

komentarz 13 lutego przez zbiku25 Bywalec (2,940 p.)

@Fiji404, nie, ale mam ponad 2500 linii więc raczej nie wkleję wszystkiego...

komentarz 13 lutego przez zbiku25 Bywalec (2,940 p.)

@VBService, sprawdziłem ale nadal nie znika :(

komentarz 13 lutego przez VBService Ekspert (246,010 p.)

mam ponad 2500 linii

To może wrzuć, proszę (oczywiście jak chcesz) np. na pastebin, może da się przy okazji "zoptymalizować"

komentarz 13 lutego przez zbiku25 Bywalec (2,940 p.)

@VBService, z przyjemnością :)

https://pastebin.com/ct81rxSa

komentarz 13 lutego przez zbiku25 Bywalec (2,940 p.)

Panowie,

wygląda na to, że znalazłem przyczynę. Otóż miałem ustawiony half na min-width:350px. Przy zmniejszaniu rozdzielczości w pewnym momencie zdjęcie wskakiwało pod ten half i widać było jego część. W przypadku rozdzielczości mojego ekranu okazało się, że powinien ustawić display:none dla half-second uż od 731 px.

Dziękuję za zaangażowanie i analizę tego case.

Wszelkie sugestie dotyczące optymalizacji mile widziane :)

Pozdrawiam,