Viewport problems in Internet Explorer

**Peeer** · 20 Apr 2009 7:40 AM

Hi!
I'm a newbie to Ext, and now I'm stuck. The code below is a (heavy) simplified version of my code. It works like a charm in firefox, but in internet explorer 8 i get some errors (and nothing is rendered except the background color).

Anyone that can see what the problem is?

/Per

Användaragent: Mozilla/4.0 (compatible; MSIE 8.0; Windows NT 5.1; Trident/4.0)
Tidsstämpling: Mon, 20 Apr 2009 15:35:35 UTC

Message: Object doesn't support this property or method
Row: 247
Character: 9
Code: 0
URI: http://localhost:3001/ext/ext-all-debug.js?1233571800

Message: 'el' is null or not an object
Row: 15314
Character: 9
code: 0
URI: http://localhost:3001/ext/ext-all-debug.js?1233571800

Code:

<!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" xml:lang="en" lang="en">
<head>
  <meta http-equiv="content-type" content="text/html;charset=UTF-8" />
  <title>Equipmentgroups: index</title>
  <link href="/stylesheets/../ext/resources/css/ext-all.css" media="screen" rel="stylesheet" type="text/css" /> 
  <script src="/javascripts/../ext/adapter/ext/ext-base.js" type="text/javascript"></script>
  <script src="/javascripts/../ext/ext-all-debug.js" type="text/javascript"></script>

<script type="text/javascript">
Ext.onReady(function(){
    //Startpanelen
    new Ext.Viewport({
        layout: 'border',
        items: {
            region: 'center',
            html: '<h1 class="x-panel-header">MegaBeta 3</h1>',
            autoHeight: true,
            border: false,
            margins: '0 0 5 0'
        },
        renderTo: Ext.getBody()

    });

})
</script>
  
</head>
<body>
Yo!
</body>
</html>

**Condor** · 20 Apr 2009 7:47 AM

1. A center region can't be autoHeight:true.
2. A viewport is always rendered to the body. The renderTo config option is never used.
3. IE has a problem with DOM manipulation when the first node inside the body is a text node (remove the 'Yo!' or add an empty before it).

**Peeer** · 20 Apr 2009 8:04 AM

Thank you!
The empty span-element solved the problem. The other two things you pointed out does not exist in the real code, it was just a copy-paste misstake.

**TheBerliner** · 22 Feb 2010 11:41 PM

Originally Posted by Condor

3. IE has a problem with DOM manipulation when the first node inside the body is a text node (remove the 'Yo!' or add an empty before it).

Condor, greatest compliments and thank you very very much for this tip! It saved me!

I had this same problem after making small changes in my index.html file. Never got the idea that this could be the cause. However, in my case the did not solve it. I had to add a div with a hidden field and that solved this stupid IE bug.

Again, thank you very much!

Viewport problems in Internet Explorer

Thread Tools

Search Thread

Display

Viewport problems in Internet Explorer

Viewport problems in Internet Explorer