Forums
View unanswered posts | View active topics It is currently Fri Oct 31, 2014 4:08 pm



Reply to topic  [ 4 posts ] 
 1e7 / 18compat mode size issue 
Author Message

Joined: Wed Oct 13, 2010 2:05 pm
Posts: 7
Post 1e7 / 18compat mode size issue
Hi all I have an issue where I am making a dropdown using superfish and the dropdown is a two part div set the left side is using pie. Sorry cant send url as its dev site. the page has a sliding animation on page load, and we do a diplay toggle on the div containing the form info as the form fields with pie were showing incorrectly (rounded object showed at the top left of the page. So we have all the page elemetns working, but I have an issue in ie7 and ie8 copat mode where when the page lads the left side of thesuperfish drop down is showing a size of width: 8100px; height: 2500px; if you mouse over the dropdown the rounded bordered object snaps instantly to the correct size.

Also for the slide in animation we use a visibility hidden on the sliding div so the user doesn't see a page load flicker.

Also I tried doing a display toggle on the dropdown divs but it did not help.

The site is done with .net and sitecore.

here is the html from the drop down

<div>
<div class="retireDropHolder" style="z-index:1000;">
<ul class="sf-menu" id="retireMenuDrop">
<div class="retireDropdown" id='retire_parent'><div class="retirementDrop" id="retireDropLeft"><span class="retireDetailsLink" id="defaultReturn"></span></div><div class="retirementRight buttonRightRound"></div></div>
<ul class="retireDetailsNames" id='retire_child'>
<li class="retireItem"><a class="retireLink" href="#" onclick="changeReturn(3);">3%</a></li>
<li class="retireItem"><a class="retireLink" href="#" onclick="changeReturn(6);">6%</a></li>
<li class="retireItem"><a class="retireLink" href="#" onclick="changeReturn(9);">9%</a></li>
<li class="retireItem"><a class="retireLink" href="#" onclick="changeReturn(12);">12%</a></li>
</ul>
<script type='text/javascript'>at_attach('retire_parent','retire_child', 'click', 'y', 'pointer');</script>
</ul>
</div>
</div>

here is the css we are using for the left side

.retirementDrop {
-moz-border-radius-bottomleft:6px;
-moz-border-radius-bottomright:0;
-moz-border-radius-topleft:6px;
-moz-border-radius-topright:0;
-moz-box-shadow:2px 2px 2px #c4c4c4;
-webkit-border-bottom-left-radius:6px;
-webkit-border-bottom-right-radius:0;
-webkit-border-top-left-radius:6px;
-webkit-border-top-right-radius:0;
-webkit-box-shadow:2px 2px 2px #c4c4c4;
background-color:#fff;
border:1px solid #c4c4c4;
border-radius:6px 0 0 6px;
color:#000;
float:left;
font:bold 12px Arial, Helvetica, sans-serif;
height:18px;
margin:0;
padding:5px 2px 0 0;
width:77px;
behavior:url(/PIE.htc);
}

any ideas


Tue Jan 18, 2011 10:05 am
Profile

Joined: Wed Jul 14, 2010 11:46 am
Posts: 1446
Post Re: 1e7 / 18compat mode size issue
It's really difficult to give advice without seeing the problem in action, unfortunately. While I've heard of issues with things like menus where elements have their display toggled, I think this is the first I've ever heard of it rendering with such huge dimensions. I don't know what Superfish does, but I can't imagine a scenario where PIE would render something that huge, unless at some point IE itself is reporting the target element as having those dimensions. It uses the offsetWidth/offsetHeight of the element directly.

Are you able to trace Superfish's code at all to see what might be setting that huge size? The markup's also a bit of a mess (ul without child li's?) but that's not likely the cause.


Wed Jan 19, 2011 10:32 pm
Profile

Joined: Wed Oct 13, 2010 2:05 pm
Posts: 7
Post Re: 1e7 / 18compat mode size issue
superfish is a solution that converts ul > li into a dropdown menu. We are using it to make a customized dropdown. I was able to find a work around which was to toggle the dropdown left dide div just after the main area slides in an d we toggle the form elelments. this has the page load consistantly across ie7 /ie8 compat mode and ie8 native. So I am all set. As for the offset sizes we are not using those only height and width. I am wondering if the cms that assembles the page is doing something with the dom because we have seen other things occur.

but end of story its working now.

thanks


Thu Jan 20, 2011 7:03 am
Profile

Joined: Fri Jan 28, 2011 11:03 am
Posts: 2
Post Re: 1e7 / 18compat mode size issue
FYI, if you put the following meta tag as the first line in your head tag, it will prevent IE8 from rendering in compatibility mode. This has helped me tremendously in providing a consistent UI in IE8.
<meta runat="server" id="IE8Meta" http-equiv="X-UA-Compatible" content="IE=EmulateIE8" />
http://blogs.msdn.com/b/askie/archive/2009/03/23/understanding-compatibility-modes-in-internet-explorer-8.aspx


Mon Jan 31, 2011 7:36 am
Profile
Display posts from previous:  Sort by  
Reply to topic   [ 4 posts ] 

Who is online

Users browsing this forum: Baidu [Spider], Bing [Bot], Google [Bot], Yahoo [Bot] and 3 guests


You cannot post new topics in this forum
You cannot reply to topics in this forum
You cannot edit your posts in this forum
You cannot delete your posts in this forum
You cannot post attachments in this forum

Search for:
Jump to:  
cron
Powered by phpBB © 2000, 2002, 2005, 2007 phpBB Group.
Designed by STSoftware for PTF.