ugrás a tartalomhoz

Negatív margin - ie-ben nem látszik a tartalom

Totti 1986 · 2010. Dec. 2. (Cs), 10.34
Sziasztok!

Lehet, hogy amatőr kérdés lesz, de Google-ban hiába találtam megoldást, nálam nem működött.

A következő kialakítást szeretném én is elérni: (http://www.brunildo.org/test/relayout.html), de nekem sehogy se megy. Szóval van egy div-em, amibe beleteszek egy másikat, és a 2. divet -150px-lel balra akarom kezdeni. FF-ben minden oké, de ie6, ie7 nem jeleníti meg a 2. divemet, mintha elbújna a bal oldalon. ie8 meg nem alkalmazza a css-t (opacity/filter:alpha) a 2. div-re, amit az 1. divhez beállítottam.

Előre is köszi a segítséget!
‹ OnClick esemény ENTER nyomásra??? FRAMESET, IFRAME, ? ›
 ■
1

Kód?

Poetro · 2010. Dec. 2. (Cs), 13.40
Valamiféle kód nélkül nem igazán lehet segíteni. Mivel nem tudjuk mit próbáltál, nem látjuk a kódot, ami nem működik, így nem is tudunk kísérletezni azzal, hogyan lehetne megjavítani. Esetleg hasznos tud lenni, ha adsz neki magasságot, mondjuk 
min-height: 1%;
vagy 
overflow: hidden;
vagy bármi más, amitől a hasLayout móka bekapcsol.
2

igaz...

Totti 1986 · 2010. Dec. 2. (Cs), 14.41
Kicsit félve írtam a kérdést, mert azt hittem, ez már egy lerágott csont, csak én vagyok béna, hogy nem találok rá megoldást. Ezért nem is írtam kódot, de most egy leegyszerűsített kódot beteszek.

<div class="panel2">
	<div id="switch_panel2" class="switch_panel2">
	</div><!-- /switch_panel2 -->
</div><!-- /panel2 -->


.panel2 /*right top*/ {
	position:fixed;
	top:200px;
	right:0;
	width:30px;
	height:100px;
	background-color:#000;
	opacity:0.4;
	filter:alpha(opacity=40);
}

* html .panel2 /* IE6 position fixed right */{
	position:absolute;
	right:auto;
	left:expression(eval(document.documentElement.scrollLeft+document.documentElement.clientWidth-this.offsetWidth)-(parseInt(this.currentStyle.marginLeft,10)||0)
	-(parseInt(this.currentStyle.marginRight,10)||0));
}

.switch_panel2 {
	position:absolute;
	/*display:none;*/
	width:150px;
	height:100px;
	margin:0 0 0 -150px;
	background-color:#ff0000;
}
Ez csak a váz, csak azt tartalmazza, ami a kérdéshez szükséges. Amúgy a "panel" diven gombok vannak, amik megnyitják a "switch_panel"-t, a gombnak megfelelő tartalommal.

Na most a "switch_panel" ie6,ie7-ben nem látszik, ie8-ban pedig nem kapja meg a "panel" opacity-jét.
3

Opacity

Poetro · 2010. Dec. 2. (Cs), 15.48
A dobozok látszódnak ha nem raksz rájuk filtert.
<!DOCTYPE HTML>
<html lang="en-US">
<head>
  <meta charset="UTF-8">
  <title></title>
  <style type="text/css">
.panel2 /*right top*/ {
    position:fixed;
    top:200px;
    right:0;
    width:30px;
    height:100px;
    background-color:#000;
}

* html .panel2 /* IE6 position fixed right */{
    position:absolute;
    right:auto;
    left:expression(eval(document.documentElement.scrollLeft+document.documentElement.clientWidth-this.offsetWidth)-(parseInt(this.currentStyle.marginLeft,10)||0)
    -(parseInt(this.currentStyle.marginRight,10)||0));
}

.switch_panel2 {
    position:absolute;
    /*display:none;*/
    width:150px;
    height:100px;
    margin:0 0 0 -150px;
    background-color:#ff0000;
}
  </style>
</head>
<body>
  <div class="panel2">
    <div id="switch_panel2" class="switch_panel2">
    </div><!-- /switch_panel2 -->
  </div><!-- /panel2 -->
</body>
</html>
Ezt teljesen jól működik. IE6-7-ben nem igazán szerencsés átlátszóságot használni, mivel általában csak a gondok vannak vele, ráadásul nem is ugyanúgy működik mint IE8 esetében.
4

tényleg

Totti 1986 · 2010. Dec. 2. (Cs), 19.14
Na most így tényleg jó.
Tehát opacity-t ne is használjak ie miatt? Az eléggé bekorlátozza ezt a panelemet. Átalakítom úgy, hogy ie-ben ne is legyen opacity. Túlélem, de akkor erre reális megoldás nincs is?