Browser compatibility Error
-
Hi i am using Mozila browser i am getting error in oveflow CSS property , here oveflow is not working . please help for this one i sent my CSS code and aspx code please clear that error thank u soo much .. .aspx code DIV id="div-datagrid" class='gridFixedHeader' style="OVERFLOW: auto; WIDTH: 100%; HEIGHT: 120px"> CSS code .gridFixedHeader { background-color:white; font-size: 9pt; color: #FFFFFF; position: relative; font-family: Airal,sans-serif; border:#0066CC; top:expression(this.offsetParent.scrollTop-0); z-index: 1; } thank u once again reg nantha
-
Hi i am using Mozila browser i am getting error in oveflow CSS property , here oveflow is not working . please help for this one i sent my CSS code and aspx code please clear that error thank u soo much .. .aspx code DIV id="div-datagrid" class='gridFixedHeader' style="OVERFLOW: auto; WIDTH: 100%; HEIGHT: 120px"> CSS code .gridFixedHeader { background-color:white; font-size: 9pt; color: #FFFFFF; position: relative; font-family: Airal,sans-serif; border:#0066CC; top:expression(this.offsetParent.scrollTop-0); z-index: 1; } thank u once again reg nantha
Hi, Try with the latest version of the Firefox.
Naresh Patel
-
Hi i am using Mozila browser i am getting error in oveflow CSS property , here oveflow is not working . please help for this one i sent my CSS code and aspx code please clear that error thank u soo much .. .aspx code DIV id="div-datagrid" class='gridFixedHeader' style="OVERFLOW: auto; WIDTH: 100%; HEIGHT: 120px"> CSS code .gridFixedHeader { background-color:white; font-size: 9pt; color: #FFFFFF; position: relative; font-family: Airal,sans-serif; border:#0066CC; top:expression(this.offsetParent.scrollTop-0); z-index: 1; } thank u once again reg nantha
Untitled Page .gridFixedHeader{ background-color:red; font-size: 9pt; color: #FFFFFF; position: relative; font-family: Airal,sans-serif; border:#0066CC; z-index: 1; overflow: auto; width: 100%; height: 120px; } .divStyle{ background-color:black; width: 99%; height: 400px; }
Thanks and Regards, Michael Sync ( Blog: http://michaelsync.net) If you want to thank me for my help, please vote my message by clicking one of numbers beside "Rate this message". Why vote? Plz Read it here. Thank you. :)
-
Untitled Page .gridFixedHeader{ background-color:red; font-size: 9pt; color: #FFFFFF; position: relative; font-family: Airal,sans-serif; border:#0066CC; z-index: 1; overflow: auto; width: 100%; height: 120px; } .divStyle{ background-color:black; width: 99%; height: 400px; }
Thanks and Regards, Michael Sync ( Blog: http://michaelsync.net) If you want to thank me for my help, please vote my message by clicking one of numbers beside "Rate this message". Why vote? Plz Read it here. Thank you. :)
I have tested with Firefox, Safari, Opera and IE7. I didn't see any problem with "
overflow: auto;
" CSS property. I know you still have problem in usingexpression
. I'm still looking for the solution. For the time being, lets discuss about overflow only. I think that the code above works fine. is it what you want or still having the problem in using that???Thanks and Regards, Michael Sync ( Blog: http://michaelsync.net) If you want to thank me for my help, please vote my message by clicking one of numbers beside "Rate this message". Why vote? Plz Read it here. Thank you. :)
-
Untitled Page .gridFixedHeader{ background-color:red; font-size: 9pt; color: #FFFFFF; position: relative; font-family: Airal,sans-serif; border:#0066CC; z-index: 1; overflow: auto; width: 100%; height: 120px; } .divStyle{ background-color:black; width: 99%; height: 400px; }
Thanks and Regards, Michael Sync ( Blog: http://michaelsync.net) If you want to thank me for my help, please vote my message by clicking one of numbers beside "Rate this message". Why vote? Plz Read it here. Thank you. :)
Hi Mr.Michael Sync thank u soo much i will try this method thank u once again.. Reg nantha
-
Untitled Page .gridFixedHeader{ background-color:red; font-size: 9pt; color: #FFFFFF; position: relative; font-family: Airal,sans-serif; border:#0066CC; z-index: 1; overflow: auto; width: 100%; height: 120px; } .divStyle{ background-color:black; width: 99%; height: 400px; }
Thanks and Regards, Michael Sync ( Blog: http://michaelsync.net) If you want to thank me for my help, please vote my message by clicking one of numbers beside "Rate this message". Why vote? Plz Read it here. Thank you. :)
Hi Mr.Michael Sync.. Thank u soo much ur code is working . but header for that grid also moving in Mozilla in IE header is fixed , but Mozilla header is moving .. so please try for this . thank soo much Reg nantha
-
Hi Mr.Michael Sync.. Thank u soo much ur code is working . but header for that grid also moving in Mozilla in IE header is fixed , but Mozilla header is moving .. so please try for this . thank soo much Reg nantha
Yeah. As I said, non-IE browsers (including Mozilla Firefox) doesn't support "CSS
expression
". So, I was looking for the solution and I found that it's too wide to cover since the solution for one case are differ from the sol for another case even all are using expresion. Okay. Here is the solution (98%) for your problem. (I said "98%" solution because this code won't work on IE7. :( ) The following code that I'm going to show is based on this great article Pure CSS Scrollable Table with Fixed Header[^] and Microsoft ASP.NET 2.0 CSS Friendly Control Adapters 1.0[^]. Let's start !! #1. Download the template from http://www.asp.net/cssadapters/ #2. Install it in your machine. ( Check-out this page to know how to install ) #3. Open C# "CSS friendly adapter Template" in Visual Studio 2005 #4. Delete "WalkThru", "CSS" and "Javascript" folder. #5. Delete all files (except GridViewAdapter and WebControlAdapterExtender ) in App_Code\Adapters. #6. Put the code (I will post in next thread because the text editor here is really bad :() in aspx #7. Pasted the code below in code-behinded file.protected void Page_Load(object sender, EventArgs e) { GridView1.DataSource = getDataTable(); GridView1.DataBind(); } private DataTable getDataTable() { DataTable dt = new DataTable(); DataColumn dc1 = new DataColumn("Header1"); dt.Columns.Add(dc1); DataColumn dc2 = new DataColumn("Header2"); dt.Columns.Add(dc2); DataColumn dc3 = new DataColumn("Header3"); dt.Columns.Add(dc3); for(int i=0;i<50;i++){ DataRow dr = dt.NewRow(); dr[0] = i.ToString(); dr[1] = i.ToString() + " Cell"; dr[2] = i.ToString() + " Text"; dt.Rows.Add(dr); } return dt; }
#8. Paste (override) the code below in GridViewAdapter.cs under App_Code\Adapters.using System; using System.Data; using System.Collec
-
Yeah. As I said, non-IE browsers (including Mozilla Firefox) doesn't support "CSS
expression
". So, I was looking for the solution and I found that it's too wide to cover since the solution for one case are differ from the sol for another case even all are using expresion. Okay. Here is the solution (98%) for your problem. (I said "98%" solution because this code won't work on IE7. :( ) The following code that I'm going to show is based on this great article Pure CSS Scrollable Table with Fixed Header[^] and Microsoft ASP.NET 2.0 CSS Friendly Control Adapters 1.0[^]. Let's start !! #1. Download the template from http://www.asp.net/cssadapters/ #2. Install it in your machine. ( Check-out this page to know how to install ) #3. Open C# "CSS friendly adapter Template" in Visual Studio 2005 #4. Delete "WalkThru", "CSS" and "Javascript" folder. #5. Delete all files (except GridViewAdapter and WebControlAdapterExtender ) in App_Code\Adapters. #6. Put the code (I will post in next thread because the text editor here is really bad :() in aspx #7. Pasted the code below in code-behinded file.protected void Page_Load(object sender, EventArgs e) { GridView1.DataSource = getDataTable(); GridView1.DataBind(); } private DataTable getDataTable() { DataTable dt = new DataTable(); DataColumn dc1 = new DataColumn("Header1"); dt.Columns.Add(dc1); DataColumn dc2 = new DataColumn("Header2"); dt.Columns.Add(dc2); DataColumn dc3 = new DataColumn("Header3"); dt.Columns.Add(dc3); for(int i=0;i<50;i++){ DataRow dr = dt.NewRow(); dr[0] = i.ToString(); dr[1] = i.ToString() + " Cell"; dr[2] = i.ToString() + " Text"; dt.Rows.Add(dr); } return dt; }
#8. Paste (override) the code below in GridViewAdapter.cs under App_Code\Adapters.using System; using System.Data; using System.Collec
Paste it in default.aspx <%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %> Cross-browser Fixed Header in GridView <!-- /* http://www.alistapart.com/articles/zebratables/ */ function removeClassName (elem, className) { elem.className = elem.className.replace(className, "").trim(); } function addCSSClass (elem, className) { removeClassName (elem, className); elem.className = (elem.className + " " + className).trim(); } String.prototype.trim = function() { return this.replace( /^\s+|\s+$/, "" ); } function stripedTable() { if (document.getElementById && document.getElementsByTagName) { var allTables = document.getElementsByTagName('table'); if (!allTables) { return; } for (var i = 0; i < allTables.length; i++) { if (allTables[i].className.match(/[\w\s ]*scrollTable[\w\s ]*/)) { var trs = allTables[i].getElementsByTagName("tr"); for (var j = 0; j < trs.length; j++) { removeClassName(trs[j], 'alternateRow'); addCSSClass(trs[j], 'normalRow'); } for (var k = 0; k < trs.length; k += 2) { removeClassName(trs[k], 'normalRow'); addCSSClass(trs[k], 'alternateRow'); } } } } } window.onload = function() { stripedTable(); } --> <!-- /* Terence Ordona, portal[AT]imaputz[DOT]com */ /* http://creativecommons.org/licenses/by-sa/2.0/ */ /* begin some basic styling here */ body { background: #FFF; color: #000; font: normal normal 12px Verdana, Geneva, Arial, Helvetica, sans-serif; margin: 10px; padding: 0 } table, td, a { color: #000; font: normal normal 12px Verdana, Geneva, Arial, Helvetica, sans-serif } h1 { font: normal normal 18px Verdana, Geneva, Arial, Helvetica, sans-serif; margin: 0 0 5px 0 } h2 { </x-turndown>