Version: (using KDE KDE 3.1) Installed from: RedHat RPMs OS: Linux Konqueror don't display HTML 4.0 pages with <DIV style="overflow:auto;"> not the right way: Try it on the follwing Sourccode which works in Mozilla, Netscape 7, Internet-Explorer and Opera: Save the SourceCode as HTML-File and open it with Mozilla. The Overflow on the left Tab doesn't work. ----------------------------- Start -----------------------------------------------> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <html> <style type="text/css"> .title { font:bold 14px Arial,sans-serif; text-align: right; } .dialog { background-color: #E7E7E7; border: 1px outset white; filter:progid:DXImageTransform.Microsoft.Shadow(color=#666666,Direction=135,Strength=4); } .titlebar { border: 1px inset white; background-color: InactiveCaption; color: captiontext; font: bold 10px Arial,sans-serif; cursor: move; } .systembutton { background-color: menu; font:bold 11px Arial,sans-serif; border: 2px outset white; width: 16px; height: 16px; color: black; text-align: center; } .defaultbutton { background-color: menu; font:bold 11px Arial,sans-serif; border: 1px outset white; height: 20px; color: black; text-align: center } .framefont { font: 11px Arial, sans-serif; } .moveable { position:absolute; } a:link { color: menutext; text-decoration: none; } .panel {border:2px outset white; background-color:menu; padding:0px; margin: 0px;} .caption {border:1px inset white; color:captiontext; background-color:activecaption; font:smallcaption; cursor:move} .tab {display: none; padding: 1ex} .tab_label_active {background-color: threedface; border: none; font: bold 11px Arial,sans-serif; color:menutext; height:20px; text-align: center; border-left:1px outset white; border-right:1px outset white} .tab_label_active a {color: menutext} .tab_label_inactive {background-color: threedlightshadow; border-bottom:2px inset white; font: 11px Arial,sans-serif; height:20px; text-align: center; border-left:1px outset white; border-right:1px outset white} .tab_label_inactive a {color: menutext; margin-left:1ex} a:visited { color: menutext; text-decoration: none; } </style> <head> <title>Dante ConfigManager 1.0</title> </head> <body bgcolor="#B9D9EC"> <table border="0" align="right" bordercolor="#ffffff" bordercolorlight="#ffffff" bordercolordark="#ffffff" style="HEIGHT: 100%; WIDTH: 100%"> <TR> <TD> </TD> <TD> </TD> </TR> <TR> <TD> </TD> <td width="160" height="160px"> <P><FONT face=Arial>Powered by </FONT> <IMG alt="" border=0 height=48 src="/isn/static/images/DanteLogo.gif" width=150> </P> </TD> </TR> </TABLE> <form action="DanteServlet" name="FrontendForm" enctype="multipart/form-data" method="POST"> <div id="Frame_14" class="moveable" style="position:absolute; left:10px; top:10px;"> <SCRIPT language="JavaScript"> IE = (document.all != null); draggingObject = null; draggingOffsetX = 0; draggingOffsetY = 0; function findContainer(target) { while (target.className != 'titlebar' && target.parentNode != null) { target = target.parentNode; } while (target && target.parentNode && target.className != 'moveable') { target = target.parentNode; } return target; } function mousedown(e) { var target = document.all? event.srcElement : e.target; target = findContainer(target); if (target.className == 'moveable') { var x = IE? event.clientX : e.pageX; var y = IE? event.clientY : e.pageY; target.style.zIndex += 10; target.unselectable = 'on'; draggingObject = target; draggingOffsetX = x - parseInt(target.style.left); draggingOffsetY = y - parseInt(target.style.top); } } function mousemove(e) { if (draggingObject != null) { var x = IE? event.clientX : e.pageX; var y = IE? event.clientY : e.pageY; x = x - draggingOffsetX; y = y - draggingOffsetY; self.status = '' + x + ':' + y; draggingObject.style.left = x + 'px'; draggingObject.style.top = y + 'px'; if (document.selection) { document.selection.createRange().collapse(); } } } function activateTab(i) { for (var j=1; j<=1000; j++) { var labelId = 'tab_label_' + j; var tabId = 'tab_' + j; var tab = document.getElementById(tabId); var label = document.getElementById(labelId); if (tab == null) break; label.className = (i==j)? 'tab_label_active' : 'tab_label_inactive'; tab.style.display = (i==j)? 'block' : 'none'; } } document.onmousedown = mousedown; document.onmousemove = mousemove; </script> <table class="dialog" style="width:650px; height:550px;"> <tr> <td class="titlebar" style="height: 19px; background-color: #3399CC;" onmouseup=" if (draggingObject != null) { document.FrontendForm.Input_15.value = draggingObject.style.left; document.FrontendForm.Input_16.value = draggingObject.style.top; draggingObject = null; } ">Dante Configuration Manager 1.0</td> </tr> <tr valign="top"> <td class="framefont"> <DIV> <LAYER> </LAYER> </DIV> <DIV STYLE="overflow: auto; position:absolute; width:641px; height:515; border: 1px inset white; padding:0px; margin: 0px; top:27px; left:5px"> <DIV height="520px"> <input type="hidden" name="Input_15" style="position:absolute; top:20px; left:20px;"> <input type="hidden" name="Input_16" style="position:absolute; top:20px; left:20px;"> <image src="../static/images/ConfigManagerTitel.gif" name="DanteImageLink_17" style="position:absolute; top:5px; left:5px;"> <DIV STYLE="position:absolute; width:600px; height:20px; border: 0px inset white; padding:0px; margin: 0px; top:115px; left:5pxpx"> <table border="0" bgcolor="menu" cellpadding="0" cellspacing="0" style="position:absolute; width:600; height:22px; left:10px; top:0px; border:1px outset white; background-color:menu;"> <tr> <td id="tab_label_1" class="tab_label_active" align="center" onclick="activateTab(1); document.FrontendForm.Input_19.value='1';">System Config Settings</td> <td id="tab_label_2" class="tab_label_inactive" align="center" onclick="activateTab(2); document.FrontendForm.Input_19.value='2';">Installation Services</td> </TR> </table> <DIV style="position:absolute; height:315px; width:600px; top:15px;left:4px; padding:0px; margin: 0px;"> <input type="hidden" name="Input_19" style="position:absolute; top:20px; left:20px;"> <div id="tab_1" class="tab" style="top:1px; height:315px;"> <LAYER> <table class="panel" style="width:600px; height:315px;"> <tr><td> <DIV style="position:absolute; overflow:auto; left:1px; top:10px; height:308px; width:600px;"> <LAYER style="position:absolute; overflow:auto; left:1px; top:10px; height:308px; width:600px;"> <p style="Arial,Helvetica; font-size:12; FONT-WEIGHT:bold; position:absolute; top:10px; left:10px;">Currently available System Settings</p> <p style="Arial,Helvetica; font-size:10; position:absolute; top:30px; left:10px;">Please be careful by changing settings. It can crash the DanteSystem!<BR>Refer to the DanteDocumentation about the function this settings</p> <p style="Arial,Helvetica; font-size:10; position:absolute; top:80px; left:10px;">system.defaultFont</p> <input type="TEXT" name="Input_24" value="Arial,Helvetica" size="30" maxlength=100 class="DanteInput" style="position:absolute; font-family:Arial,Helvetica; font-size:10px; top:80px; left:300px;" > <p style="Arial,Helvetica; font-size:10; position:absolute; top:100px; left:10px;">system.sessionDB</p> <input type="TEXT" name="Input_26" value="none" size="30" maxlength=100 class="DanteInput" style="position:absolute; font-family:Arial,Helvetica; font-size:10px; top:100px; left:300px;" > <p style="Arial,Helvetica; font-size:10; position:absolute; top:120px; left:10px;">system.buttontextalign</p> <input type="TEXT" name="Input_28" value="center" size="30" maxlength=100 class="DanteInput" style="position:absolute; font-family:Arial,Helvetica; font-size:10px; top:120px; left:300px;" > <p style="Arial,Helvetica; font-size:10; position:absolute; top:140px; left:10px;">system.defaultBold</p> <input type="TEXT" name="Input_30" value="0" size="30" maxlength=100 class="DanteInput" style="position:absolute; font-family:Arial,Helvetica; font-size:10px; top:140px; left:300px;" > <p style="Arial,Helvetica; font-size:10; position:absolute; top:160px; left:10px;">system.defaultItalic</p> <input type="TEXT" name="Input_32" value="0" size="30" maxlength=100 class="DanteInput" style="position:absolute; font-family:Arial,Helvetica; font-size:10px; top:160px; left:300px;" > <p style="Arial,Helvetica; font-size:10; position:absolute; top:180px; left:10px;">system.frameTitleFont</p> <input type="TEXT" name="Input_34" value="Arial, sans-serif" size="30" maxlength=100 class="DanteInput" style="position:absolute; font-family:Arial,Helvetica; font-size:10px; top:180px; left:300px;" > <p style="Arial,Helvetica; font-size:10; position:absolute; top:200px; left:10px;">system.activeCaptionColor</p> <input type="TEXT" name="Input_36" value="#3399CC" size="30" maxlength=100 class="DanteInput" style="position:absolute; font-family:Arial,Helvetica; font-size:10px; top:200px; left:300px;" > <p style="Arial,Helvetica; font-size:10; position:absolute; top:220px; left:10px;">system.defaultFontSize</p> <input type="TEXT" name="Input_38" value="12px" size="30" maxlength=100 class="DanteInput" style="position:absolute; font-family:Arial,Helvetica; font-size:10px; top:220px; left:300px;" > <p style="Arial,Helvetica; font-size:10; position:absolute; top:240px; left:10px;">system.passiveCaptionColor</p> <input type="TEXT" name="Input_40" value="#909090" size="30" maxlength=100 class="DanteInput" style="position:absolute; font-family:Arial,Helvetica; font-size:10px; top:240px; left:300px;" > <p style="Arial,Helvetica; font-size:10; position:absolute; top:260px; left:10px;">system.sessionManagement</p> <input type="TEXT" name="Input_42" value="local" size="30" maxlength=100 class="DanteInput" style="position:absolute; font-family:Arial,Helvetica; font-size:10px; top:260px; left:300px;" > <p style="Arial,Helvetica; font-size:10; position:absolute; top:280px; left:10px;">system.adminuser</p> <input type="TEXT" name="Input_44" value="admin" size="30" maxlength=100 class="DanteInput" style="position:absolute; font-family:Arial,Helvetica; font-size:10px; top:280px; left:300px;" > <p style="Arial,Helvetica; font-size:10; position:absolute; top:300px; left:10px;">system.BGColor</p> <input type="TEXT" name="Input_46" value="#B9D9EC" size="30" maxlength=100 class="DanteInput" style="position:absolute; font-family:Arial,Helvetica; font-size:10px; top:300px; left:300px;" > <p style="Arial,Helvetica; font-size:10; position:absolute; top:320px; left:10px;">system.adminpw</p> <input type="TEXT" name="Input_48" value="password" size="30" maxlength=100 class="DanteInput" style="position:absolute; font-family:Arial,Helvetica; font-size:10px; top:320px; left:300px;" > <p style="Arial,Helvetica; font-size:10; position:absolute; top:340px; left:10px;">system.defaultbackColor</p> <input type="TEXT" name="Input_50" value="Silver" size="30" maxlength=100 class="DanteInput" style="position:absolute; font-family:Arial,Helvetica; font-size:10px; top:340px; left:300px;" > <p style="Arial,Helvetica; font-size:10; position:absolute; top:360px; left:10px;">system.frameTitelFontsize</p> <input type="TEXT" name="Input_52" value="11px" size="30" maxlength=100 class="DanteInput" style="position:absolute; font-family:Arial,Helvetica; font-size:10px; top:360px; left:300px;" > <p style="Arial,Helvetica; font-size:10; position:absolute; top:380px; left:10px;">system.buttoncolor</p> <input type="TEXT" name="Input_54" value="menu" size="30" maxlength=100 class="DanteInput" style="position:absolute; font-family:Arial,Helvetica; font-size:10px; top:380px; left:300px;" > <p style="Arial,Helvetica; font-size:10; position:absolute; top:400px; left:10px;">system.buttonheight</p> <input type="TEXT" name="Input_56" value="20px" size="30" maxlength=100 class="DanteInput" style="position:absolute; font-family:Arial,Helvetica; font-size:10px; top:400px; left:300px;" > <p style="Arial,Helvetica; font-size:10; position:absolute; top:420px; left:10px;">system.ldaphost</p> <input type="TEXT" name="Input_58" value="ldap://192.168.1.4" size="30" maxlength=100 class="DanteInput" style="position:absolute; font-family:Arial,Helvetica; font-size:10px; top:420px; left:300px;" > <p style="Arial,Helvetica; font-size:10; position:absolute; top:450px; left:10px;">\</p> </DIV></LAYER> </TD></TR> </table> </LAYER> </div> <div id="tab_2" class="tab" style="top:1px; height:315px;"> <LAYER> <table class="panel" style="width:600px; height:315px;"> <tr><td> <DIV style="position:absolute; overflow:auto; left:1px; top:10px; height:308px; width:600px;"> <LAYER style="position:absolute; overflow:auto; left:1px; top:10px; height:308px; width:600px;"> <p style="Arial,Helvetica; font-size:10; position:absolute; top:20px; left:20px;">Hier kommt die Installation</p> </DIV></LAYER> </TD></TR> </table> </LAYER> </div> </DIV> <script language="JavaScript"> activateTab(1) </script><input type="submit" class="defaultbutton" name="Button_62" id="Button_62" value="Save the Settings" class="DanteButton" style="position:absolute; border-style: outset; font-family:Arial,Helvetica; font-size:10; left:480px; top:350px;" > <p style="Arial,Helvetica; font-size:10; FONT-WEIGHT:bold; position:absolute; top:25px; left:10px;"></p> </DIV> </DIV> </td> </tr> </table> </div> <input type="hidden" name="LinkAction" value="noAction"> <input type="hidden" name="BrowserName" value="noBrowser"> <input type="hidden" name="BrowserVersion" value="noBrowser"> <input type="hidden" name="AvailabeWidth" value="0"> <input type="hidden" name="AvailabeHeight" value="0"> <input type="hidden" name="OperatingSystem" value="noOS"> </form> <SCRIPT language="JavaScript"> var agt=navigator.userAgent document.FrontendForm.BrowserName.value = navigator.appName; document.FrontendForm.BrowserVersion.value = navigator.appVersion; if ((agt.indexOf("Win95")!=-1)||(agt.indexOf("Windows 95")!=-1)) { document.FrontendForm.OperatingSystem.value = 'Windows 95'; } if ((agt.indexOf("Win98")!=-1)||(agt.indexOf("Windows 98")!=-1)) { document.FrontendForm.OperatingSystem.value = 'Windows 98'; } if ((agt.indexOf("WinNT")!=-1)||(agt.indexOf("Windows NT")!=-1)) { document.FrontendForm.OperatingSystem.value = 'Windows NT'; } if ((agt.indexOf("Win16")!=-1)||(agt.indexOf("Windows 3.1")!=-1)) { document.FrontendForm.OperatingSystem.value = 'Windows 3.x'; } if (agt.indexOf("Macintosh")!=-1) { if (agt.indexOf("PC)")!=-1) { document.FrontendForm.OperatingSystem.value = 'Mac PPC'; } else { yourOS='Mac 68K'; } } if (agt.indexOf("SunOS")!=-1) {document.FrontendForm.OperatingSystem.value = 'Unix Sun'} if (agt.indexOf("IRIX")!=-1) {document.FrontendForm.OperatingSystem.value = 'Unix SGI'} if (agt.indexOf("HP-UX")!=-1) {document.FrontendForm.OperatingSystem.value = 'Unix HP'} if (agt.indexOf("AIX")!=-1) {document.FrontendForm.OperatingSystem.value = 'Unix IBM'; } document.FrontendForm.AvailabeWidth.value = screen.availwidth; document.FrontendForm.AvailabeHeight.value = screen.availHeight; </SCRIPT> </body> </html>
Created attachment 1499 [details] Screenshow of the View in Konqueror
Created attachment 1500 [details] View of the same document in Mozilla
http://konqueror.org/css/ documents that overflow:auto is not yet supported. *** This bug has been marked as a duplicate of 11336 ***
FYI, overflow: auto support was recenty added to Safari by Hyatt and should be in for Konq 3.2