CSS okienko popup

0
#popup_shadow
{
	position:fixed;
	top:0%;
	left:0%;
	display:none;
	background-color:gray;
	-moz-opacity:0.5;
	-webkit-opacity:0.5;
	opacity:0.5;
	filter:alpha(50);
	z-index:100;
	width:100%;
	height:100%;
}
#popup_padding
{
	padding: 10px;
}
#popup
{
	-moz-opacity:1;
	-webkit-opacity:1;
	opacity:1;
	filter:alpha(100);
	display:none;
	border: 1px;
	border-style: solid;
	border-color: yellow;
	background-color:orange;
	margin:0px auto;
	width: 300px;
	height: 200px;
	z-index:101;
}
<div id="popup_shadow" align="center">
		<div id="popup">
			<div id="popup_padding">
    	  <span id="popup_text"></span>
    	  <br /><br />
     	<span id="popup_alert" class="popup_close">OK</span>
		</div>
	</div>

Mój problem polega na tym, że div popup przejmuje opacity rodzica(popup_shadow) i nie wiem jak to zmienić, dałem w popup opacity 1 ale to nic nie daje :P

I jeszcze jak wyśrodkować popup'a pionowo ?

0

Mój problem polega na tym, że div popup przejmuje opacity rodzica(popup_shadow) i nie wiem jak to zmienić, dałem w popup opacity 1 ale to nic nie daje

To jest oczywiste. Ustawiasz przezroczystość dla kontenera, więc wszystkie elementy w nim zawarte też muszą być przezroczyste. Matematycznie najłatwiej to wytłumaczyć tak - wartość opacity elementu jest mnożona z wartościami opacity dla wszystkich elementów nadrzędnych. Jeśli chcesz, żeby tylko tło było przezroczyste, to przypisz właściwości background kolor za pomocą rgba (starsze przeglądarki tego nie obsługują), lub stwórz dwie niezależne warstwy - jedna będzie przezroczysta, druga będzie zawierała Twoje okienko i nie będzie przezroczysta (sam tak robiłem, działa na IE7).

I jeszcze jak wyśrodkować popup'a pionowo ?

Jak rozumiem Twój popup będzie uruchamiany za pomocą javascript, więc to zadanie też możesz sobie zrealizować za pomocą javascript ;)

1 użytkowników online, w tym zalogowanych: 0, gości: 1