Ukrycie diva przy określonej rozdzielczości

Question

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;

	}
}

 

Comments

to są twoje wszystkie style CSS ?

---

@zbiku25, Sprawdź

[ on-line ]

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

 

---

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

---

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

---

mam ponad 2500 linii 

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

---

@VBService, z przyjemnością :)

https://pastebin.com/ct81rxSa

---

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,