Re: [WSG] Z-Index in IE - Got a problem need help
- Original Message - From: "Peter Asquith" <[EMAIL PROTECTED]> To: <[EMAIL PROTECTED]> Sent: Monday, September 06, 2004 12:04 AM Subject: Re: [WSG] Z-Index in IE - Got a problem need help > Hi Jay > > Once you've dropped down a .sidecontent menu, in IE6, if you click > elsewhere on the page, the hidden element leaps to the top of the > z-order. I think the problem arises from using margins to effect the > overlap. Additionally, due to the order of execution, this is also > responsible for the flicker. > > If you use the actual positioning of the .sidecontent elements (say, > top: -25px;) instead of deflating the margin then the strange effects in > IE go away. > > I've created a mock up at http://www.wasabicube.com/test/testover.html > which demonstrates this working. > > Cheers > Peter Ah! That solved the problem perfectly! I knew it was something very simple which I'd overlooked. Thanks a bunch. Jay S Hills ** The discussion list for http://webstandardsgroup.org/ Proud presenters of Web Essentials 04 http://we04.com/ Web standards, accessibility, inspiration, knowledge To be held in Sydney, September 30 and October 1, 2004 See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list & getting help **
Re: [WSG] Z-Index in IE - Got a problem need help
Jay Hills wrote: You can use Mozilla/Firefox/Opera to see what I mean at http://www.ikonik.net/2/. It works in Internet Explorer but the tabs 'flicker'. Is this a problem with the Z-index in IE or have I done something else wrong with my CSS? link: http://www.ikonik.net/2/css/visual.css. Hi Jay Once you've dropped down a .sidecontent menu, in IE6, if you click elsewhere on the page, the hidden element leaps to the top of the z-order. I think the problem arises from using margins to effect the overlap. Additionally, due to the order of execution, this is also responsible for the flicker. If you use the actual positioning of the .sidecontent elements (say, top: -25px;) instead of deflating the margin then the strange effects in IE go away. I've created a mock up at http://www.wasabicube.com/test/testover.html which demonstrates this working. Cheers Peter ** The discussion list for http://webstandardsgroup.org/ Proud presenters of Web Essentials 04 http://we04.com/ Web standards, accessibility, inspiration, knowledge To be held in Sydney, September 30 and October 1, 2004 See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list & getting help **
[WSG] Z-Index in IE - Got a problem need help
Hello,
After reading DWWS (Zeldman) and fiddling around with some DOM script, I've
got a series of tabs which when clicked reveal a menu underneath, using
toggling of the CSS display element. (display: none; and display: ; is
toggled).
I used Z-index 1 for the tab, and Z-index 2 for the content, so that the
content will be above the tab and the content background will overlap the
bottom of the tab for that "extending effect".
You can use Mozilla/Firefox/Opera to see what I mean at
http://www.ikonik.net/2/. It works in Internet Explorer but the tabs
'flicker'. Is this a problem with the Z-index in IE or have I done something
else wrong with my CSS? link: http://www.ikonik.net/2/css/visual.css.
Any help would be appreciated, thanks in advance.
---
Snippets:
CSS:
#features .sidecontent {
background: url(../img/iko/sdmid.gif) repeat-y bottom center;
z-index: 2;
position: relative;
margin-top: -15px;
padding: 5px 10px 10px;
}
#features h2 {
z-index: 1;
margin-top: 5;
margin-left: 0;
margin-bottom: 0px;
width: 195px;
background-color: #FFF;
color: #666;
position: relative;
XHTML:
Tech and Web
Art and Design
Thoughts and Life
---
Thanks again, it's probably something real silly but I can't work it out. I
only have a flicker problem in IE.
Jay S Hills
www.ikonik.net
ps. For some reason 'MDaemon' (daemonite.net?) puts me down as spam so I can
never submit to this list usually.
**
The discussion list for http://webstandardsgroup.org/
Proud presenters of Web Essentials 04 http://we04.com/
Web standards, accessibility, inspiration, knowledge
To be held in Sydney, September 30 and October 1, 2004
See http://webstandardsgroup.org/mail/guidelines.cfm
for some hints on posting to the list & getting help
**
[WSG] Z-Index in IE - Got a problem need help
Hello,
After reading DWWS (Zeldman) and fiddling around with some DOM
script, I've got a series of tabs which when clicked reveal a menu underneath,
using toggling of the CSS display element. (display:
none; and display: ; is toggled).
I used Z-index 1 for the tab, and Z-index 2 for the content,
so that the content will be above the tab and the content background will
overlap the bottom of the tab for that "extending effect".
You can use Mozilla/Firefox/Opera to see what I mean at http://www.ikonik.net/2/. It works in
Internet Explorer but the tabs 'flicker'. Is this a problem with the Z-index in
IE or have I done something else wrong with my CSS? link: http://www.ikonik.net/2/css/visual.css.
Any help would be appreciated, thanks in advance.
Snippets:
CSS:
#features .sidecontent { background:
url(../img/iko/sdmid.gif) repeat-y bottom center; z-index:
2; position: relative; margin-top: -15px; padding:
5px 10px 10px;
} #features h2
{ z-index: 1; margin-top: 5; margin-left:
0; margin-bottom: 0px; width:
195px; background-color: #FFF; color: #666; position:
relative;
XHTML:
Tech and
Web Art and
Design
Thoughts and Life
Thanks again, it's probably something real silly but I can't
work it out. I only have a flicker problem in IE.
Jay S Hills
www.ikonik.net
