Intersoft Solutions - Community - WebGrid Enterprise

Create New

New Discussion
New Question
New Product Feedback

Post Reply

James HartleyMember

Posted: June 27, 2011 8:19 AM

Hi,

I'm having an issue using WebGrid version 7.0.7200.430 with IE8 when running in IE7 compatibility mode in my company's intranet environment. The headings don't align with the data.

My company's standard for the intranet is IE8 running in IE7 compatibility mode so, even though I use the meta tag <meta http-equiv="X-UA-Compatible" content="IE=8"/> in my Site.Master, IE8 continues to run in IE7 compatibility mode.

Everything works great except the column alignment in the WebGrid. Is there a work-around for this issue?

Thanks,

James Hartley

1 attachment

example.jpg

Quick Reply

Quote

All Replies

Martin LieSupport

Posted: June 28, 2011 5:23 AM in response to James Hartley

Hello James,

I've successfully replicated your issue on my end. The issue is gone when you set the DocumentMode to Quirks mode.

I'm forwarding this issue to the developer team to be investigated further.

I will let you know when I get any feedback/workaround from them.

Thank you.

Regards,
-Martin-

Quick Reply

Quote

Martin LieSupport

Posted: June 28, 2011 6:06 AM in response to Martin Lie

Hello,

I suggest you to use the following XHTML DocType

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

I believe it works on your environment.

Thank you.

Regards,
-Martin-

Quick Reply

Quote

James HartleyMember

Posted: June 28, 2011 7:44 AM in response to Martin Lie

Hi Martin,

Thanks for your replies. Unfortunately I am already using the exact doctype you mention in your second email. As for quirks mode (which I enabled temporarily by removing the doctype altogether) it has no effect while I have the <meta http-equiv="X-UA-Compatible" content="IE=8"/> tag in place. If I also take out the meta tag then the grid is okay but the rest of my CSS styling goes crazy.

James

Quick Reply

Quote

Martin LieSupport

Posted: June 29, 2011 10:53 PM in response to James Hartley

Hello James,

I'm attaching my sample including the meta setting and DocType. Please try to run the sample on your end and see how the result is.

However, could you explain your issue in more details? So, when you run the project using IE8 browser, do you change the Document Mode to IE7 compatibility / change the Browser Mode to IE7 Compatibility? Can you provide a screenshot of your developer tools along with your project?

I'm running the project and by default, it will open the project using Browser Mode as IE8 and Document Mode to IE8 standards (as you can see in Grid1.png attached).

Then, I change the Browser Mode to IE7 and Document Mode to IE 7 standards (as you can see in Grid2.png).

I don't have IE7 compatibility option in my developer tools.

Thank you.

Regards,
-Martin-

3 attachments

James HartleyMember

Posted: June 30, 2011 9:55 AM in response to Martin Lie

Hi Martin,

Thanks for your reply. I have run your sample file and am still getting the same issue. I’ve zipped up and attached the sample project I was testing with along with some screen shots.

I don’t have any special CSS debugging tools for IE, only straight VS 2008, although I have some JavaScript that gives me browser info (click “Browser Info” button in sample app or see screen shots).

I will try to explain more clearly what the problem is:

My app is designed for our intranet, where IE8 is running in compatibility view on all users’ PCs (browser setting is determined by group policy). See screen shot IE8_compatibility_view_settings.png. Please assume that this setting cannot be changed, as we have many older web apps that require this setting.
Until recently I was coding to IE8 CSS standards as I was developing on my own PC, and “localhost” never uses compatibility view unless you explicitly set it. When I discovered this I explicitly included localhost in my IE8 compatibility settings (see screen shot IE8_compatibility_view_settings.png).
In order to continue to code to IE8 standards, I added the meta tag <meta http-equiv="X-UA-Compatible" content="IE=8" /> to my web page. This works great, except for the heading alignment issue in the WebGrid.
To try to get around the grid issue I took out the meta tag and tried coding to IE7 standards. This fixes the grid, but introduces new problems. These are mostly minor except for the WebCombo, which stays put within a scrolling DIV (see sample app, WebComboInScrollingDiv.aspx example page.
I have WebGrids and WebCombos on the same web page in my "real" app, so cannot have the meta tag for one and not the other.

To summarize, if I have the meta tag in place, the WebGrid does not work but the WebCombo does work; if I take out the meta tag the WebGrid works but the WebCombo does not work.

I would prefer a solution that fixes the WebGrid in Compatibility Mode/DocMode 8 (see browser info screen shots), but if you can tell me a way to fix the WebCombo in Compatibility Mode/DocMode 7 that would be fine (please see the sample app’s JavaScript code for how “Compatibility Mode” is determined in these pop-ups).

Hope this helps!

James

2 attachments

Martin LieSupport

Posted: July 1, 2011 4:41 AM in response to James Hartley

Hello James,

I have tested your project here. The grid's heading was misaligned too on my end.

So the point is, WebGrid needs to be able to run under IE8 Compatibility view per your requirement. Is this correct?

Therefore, I will need to discuss further about this issue with the developer team.

I will let you know the progress as soon as possible.

Thank you.

Regards,
-Martin-

Quick Reply

Quote

James HartleyMember

Posted: July 4, 2011 7:26 AM in response to Martin Lie

Martin wrote:

"So the point is, WebGrid needs to be able to run under IE8 Compatibility view per your requirement. Is this correct?"

Yes, that's correct. Thanks for your help.

James

Quick Reply

Quote

Martin LieSupport

Posted: July 5, 2011 3:35 AM in response to James Hartley

Hello James,

Your issue has been submitted to the developert team.

Hopefully, they can come up with a solution as soon as possible.

Thank you for your patient.

Regards,
-Martin-

Quick Reply

Quote

Martin LieSupport

Posted: July 11, 2011 6:46 PM in response to James Hartley

Hello James,

I just got the update from the developer team.

Currently our products including WebGrid is not designed for compatibility view because it’s IE specific stuff. Our tools basically render the pages based on the specified document type. However, the compatibility mode causes the rendering to use old browser mode while our library still consider it as XHTML.

Therefore, they highly suggest the users to use pure standards mode and leave the compatibility view for best results.

Hope this helps. Thank you.

Regards,
-Martin-

Quick Reply

Quote

James HartleyMember

Posted: July 18, 2011 9:12 AM in response to Martin Lie

Hi Martin,

Thanks for your reply. I will work around the problem.

James

Quick Reply

Quote

Karl PietschMember

Posted: July 27, 2011 6:19 AM in response to James Hartley

I've also had similar problems and have given up on XHTML doctype for IE versions prior to 8. I think mainly when I have colum autosizing on or if using the grid refresh funciton things don;t line-up or fit properly.

If I detect browser is IE and version 7 or less I change doctype to

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" >

then it renders ok in IE 5.5, 6 or 7.

It's not ideal as this will cause rendering differences if you use float and css auto margins in places.

my pages all inherit this class:

Public Class TemplatePage

Inherits System.Web.UI.Page

Sub Page_PreInit(ByVal sender As Object, ByVal e As EventArgs) _

Handles Me.PreInit

If Request.Browser.Browser = "IE" Then

If Convert.ToDecimal(Request.Browser.Version) < 8.0 Then

Me.MasterPageFile = "~/Site_html4.0.master"

End If

End Sub

End Class

Quick Reply

Quote

Martin LieSupport

Posted: July 28, 2011 3:04 AM in response to Karl Pietsch

Hello,

Does it mean your issue is solved when you are using XHTML DocType?

Thank you.

Regards,
-Martin-

Quick Reply

Quote

James HartleyMember

Posted: August 9, 2011 9:36 AM in response to Martin Lie

Thanks, Karl - that's a neat idea. In my own code I have stuck with the XHTML doctype but have removed the <meta http-equiv="X-UA-Compatible" content="IE=8"/> tag from my master page. I had to change a few of my styles to get my layout to appear properly in IE8 when running in IE7 compatibility mode, but now it's working okay.

Martin, I wouldn't say the issue is fixed exactly, but there are acceptable workarounds. Feel free to mark the issue as closed.

Thanks,

James

Quick Reply

Quote

Services

Support

Community / WebGrid

Heading Alignment issue in IE8

Answers

All Replies

Business Platform

Development Tools

Community / WebGrid

Heading Alignment issue in IE8

Answers

All Replies

Sign in to Intersoft Account

Sign in to Intersoft Account

Link Existing Account

Create New Account

Link Existing Account

Sign in to Intersoft Account

Sign in to Intersoft Account

Create New Intersoft Account

Forgot Password

Your new password has been sent to your email.