Tycoon Talk
Become a Big fish!
The number 1 forum for online business!
Post topics, ask questions, share your knowledge.
Tycoon Talk is part of Freelancer.com - find skilled workers online at a fraction of the cost.

CSS Forum


You are currently viewing our CSS Forum as a guest. Please register to participate.
Login



Reply
Z-Index in IE7 and IE8
Old 07-08-2011, 08:30 AM Z-Index in IE7 and IE8
TripleMoons's Avatar
Webmaster Talker

Posts: 619
Name: Stephanie Kunder
Location: Hanover, PA
Trades: 0
I don't frequently work with z-indexes, but this website required its use and IE is officially driving me mad over it.

The couple to the right, despite the CSS being set to a height of 329px with a z-index of 500 is cut off at the banner in IE7 and IE8. What am I missing that would be causing this? FireFox, Safari and IE9 everything displays properly.

Code:
div#bridalcouple {width:264px; height:329px; background:url(http://www.nycweddinginvitations.org/wp-content/uploads/2011/06/bridal-couple.png); float:right; z-index:500;}
__________________

Please login or register to view this content. Registration is FREE


Please login or register to view this content. Registration is FREE


Last edited by TripleMoons; 07-09-2011 at 04:18 PM..
TripleMoons is offline
Reply With Quote
View Public Profile Visit TripleMoons's homepage!
 
 
Register now for full access!
Old 07-08-2011, 08:52 AM Re: Z-Index in IE7 and IE8
Experienced Talker

Posts: 35
Trades: 0
Hello ,
I saw your site every thing looks fine,

is the issue is solved ?? please let me know

i have seen IE7 and IE8 and IE9
__________________
Magento Themes Experts

Please login or register to view this content. Registration is FREE
|
Please login or register to view this content. Registration is FREE
shankar.adodis is offline
Reply With Quote
View Public Profile
 
Old 07-08-2011, 08:57 AM Re: Z-Index in IE7 and IE8
TripleMoons's Avatar
Webmaster Talker

Posts: 619
Name: Stephanie Kunder
Location: Hanover, PA
Trades: 0
No, it is not. The couple is still cut off in IE7 and IE8.
Attached Images
File Type: jpg cutoffcouple.jpg (79.6 KB, 3 views)
__________________

Please login or register to view this content. Registration is FREE


Please login or register to view this content. Registration is FREE


Last edited by TripleMoons; 07-08-2011 at 09:02 AM.. Reason: Added Screenshots
TripleMoons is offline
Reply With Quote
View Public Profile Visit TripleMoons's homepage!
 
Old 07-08-2011, 10:02 AM Re: Z-Index in IE7 and IE8
chrishirst's Avatar
Missing! presumed drunk.

Posts: 42,371
Name: Chris Hirst
Location: Blackpool. UK
Trades: 0
z-index is only applicable when the elements are positioned other than static.
__________________
Chris. ->>
Please login or register to view this content. Registration is FREE
<<-

A foolish consistency is the hobgoblin of little minds
Thought for today:- Is SEO the only industry where all the cowboys are Indians?
chrishirst is offline
Reply With Quote
View Public Profile Visit chrishirst's homepage!
 
Old 07-08-2011, 10:04 AM Re: Z-Index in IE7 and IE8
TripleMoons's Avatar
Webmaster Talker

Posts: 619
Name: Stephanie Kunder
Location: Hanover, PA
Trades: 0
Ok. This means I have to do what?

Why is it working in all modern browsers if this is the problem? Or are you saying the static issue is IE7/8 problem only?
__________________

Please login or register to view this content. Registration is FREE


Please login or register to view this content. Registration is FREE

TripleMoons is offline
Reply With Quote
View Public Profile Visit TripleMoons's homepage!
 
Old 07-08-2011, 10:48 AM Re: Z-Index in IE7 and IE8
chrishirst's Avatar
Missing! presumed drunk.

Posts: 42,371
Name: Chris Hirst
Location: Blackpool. UK
Trades: 0
IE7 & 8 just have problems with zindex generally. (I bet you're surprised at that )

add position relative to the elements you want to change the stacking order on.
__________________
Chris. ->>
Please login or register to view this content. Registration is FREE
<<-

A foolish consistency is the hobgoblin of little minds
Thought for today:- Is SEO the only industry where all the cowboys are Indians?
chrishirst is offline
Reply With Quote
View Public Profile Visit chrishirst's homepage!
 
Old 07-08-2011, 10:58 AM Re: Z-Index in IE7 and IE8
TripleMoons's Avatar
Webmaster Talker

Posts: 619
Name: Stephanie Kunder
Location: Hanover, PA
Trades: 0
Good, good, good...

How do I get IE9 to NOT read the hacks for IE7/8 to make the sidebar clear the z-index image?
__________________

Please login or register to view this content. Registration is FREE


Please login or register to view this content. Registration is FREE

TripleMoons is offline
Reply With Quote
View Public Profile Visit TripleMoons's homepage!
 
Old 07-08-2011, 01:42 PM Re: Z-Index in IE7 and IE8
chrishirst's Avatar
Missing! presumed drunk.

Posts: 42,371
Name: Chris Hirst
Location: Blackpool. UK
Trades: 0
get rid of the "hacks" would be best all round.

Failing that use conditional comments instead of "hacks"
__________________
Chris. ->>
Please login or register to view this content. Registration is FREE
<<-

A foolish consistency is the hobgoblin of little minds
Thought for today:- Is SEO the only industry where all the cowboys are Indians?
chrishirst is offline
Reply With Quote
View Public Profile Visit chrishirst's homepage!
 
Old 07-08-2011, 03:20 PM Re: Z-Index in IE7 and IE8
TripleMoons's Avatar
Webmaster Talker

Posts: 619
Name: Stephanie Kunder
Location: Hanover, PA
Trades: 0
Without the hacks, the items in the sidebar appear beneath the couple in IE7/8.
__________________

Please login or register to view this content. Registration is FREE


Please login or register to view this content. Registration is FREE

TripleMoons is offline
Reply With Quote
View Public Profile Visit TripleMoons's homepage!
 
Old 07-08-2011, 04:06 PM Re: Z-Index in IE7 and IE8
TripleMoons's Avatar
Webmaster Talker

Posts: 619
Name: Stephanie Kunder
Location: Hanover, PA
Trades: 0
Conditional comments do not work. No effect.

Tried both of the following...

Code:
<!--[if IE 8]>
<div style="clear:both;"></div>
<![endif]-->
Quote:
<!--[if IE 8]>
<div style="width:200px;height:170px;"></div>
<![endif]-->
__________________

Please login or register to view this content. Registration is FREE


Please login or register to view this content. Registration is FREE

TripleMoons is offline
Reply With Quote
View Public Profile Visit TripleMoons's homepage!
 
Old 07-09-2011, 04:11 PM Re: Z-Index in IE7 and IE8
LadynRed's Avatar
Defies a Status

Posts: 10,017
Location: Tennessee
Trades: 0
Conditional comments DO work, but embedding them in your code like that isn't generally the way to use them. There's an ever better way to utilize conditional comments that I'm using now, and it works a treat.
Quote:
<!--[if IE 7]><html class="ie7" lang="en-US"><![endif]-->
<!--[if IE 8]><html class="ie8" lang="en-US"><![endif]-->
<!--[if gt IE 8]><!--><html lang="en-US"><!--<![endif]-->
What that does, obviously, is add the .ie7, or .ie8 class to the html, then you can apply styles needed to force IE to behave in a single CSS file, just by using that class name, for example:
Quote:
.ie7 #content{rules here to fix IE7 problems}
No additional css files needed for each version of IE.

I've also pretty much stopped using the clearing method on some html element and use this instead:
Quote:

/* self-clear floats */
.group:after {
clear: both;
content: "\0020";
display: block;
height: 0;
overflow: hidden;
visibility: hidden;
}

/* IE 7 self-clear floats */
*:first-child+html .group,
*:first-child+html div.article-body,
*:first-child+html #wrap {
min-height: 1px;
}
__________________
Web Goddess & Web Standards Evangelist :) - Tables Be Gone !!

Please login or register to view this content. Registration is FREE


Please login or register to view this content. Registration is FREE

LadynRed is offline
Reply With Quote
View Public Profile
 
Old 07-09-2011, 04:17 PM Re: Z-Index in IE7 and IE8
TripleMoons's Avatar
Webmaster Talker

Posts: 619
Name: Stephanie Kunder
Location: Hanover, PA
Trades: 0
The WordPress theme runs on thesis, so editing is limited. I just changed the z-index of the sidebar to pull it over top the couple. IE7/8 users will just have to deal with the degrading.
__________________

Please login or register to view this content. Registration is FREE


Please login or register to view this content. Registration is FREE

TripleMoons is offline
Reply With Quote
View Public Profile Visit TripleMoons's homepage!
 
Reply     « Reply to Z-Index in IE7 and IE8
 

Thread Tools Search this Thread
Search this Thread:

Advanced Search

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Trackbacks are Off
Pingbacks are Off
Refbacks are Off





   
RSS Feed  Feeds: RSS   JS   XML
RSS Feed  Feeds for this forum: RSS   JS   XML



Page generated in 0.62116 seconds with 13 queries