Ok. Here is the scenario. I found out what has been happening, but not
why.
Apparently, if you have a Datagrid with no "Font-size=smaller", IE and
Mozilla act the same (whether or not you have a style a {smaller}.
If you now add "Font-size=smaller", IE will get smaller but Mozilla will
ignore it. Mozilla doesn't ignore the other font styles, such as
"Font-name" - only "Font-Size".
Then if you have a style a {smaller} and "font-size=smaller" it is additive.
It will take the smaller from the "style a" and than will make it even
smaller from the "font-size" in the DataGrid.
This does not happen in Mozilla since it ignores the "font-size in the
DataGrid"
Which is correct?
Here are 3 files that show the behavior
1st: no font-smaller or style a{smaller}
************************************************** ******************************************
<%@ Page Language="VB" Debug="true" ContentType="text/html"
ResponseEncoding="iso-8859-1" %>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" >
<%@ Import Namespace="System.Collections" %>
<%@ Import Namespace="System.Data" %>
<%@ Import Namespace="System.Data.SqlClient" %>
<script runat="server">
Function CreateDataSource() As ICollection
Dim dt As DataTable
Dim dr As DataRow
Dim i As Integer
'create a DataTable
dt = New DataTable()
dt.Columns.Add(New DataColumn("StringValue", GetType(String)))
dt.Columns.Add(New DataColumn("BoolValue", GetType(Boolean)))
dt.Columns.Add(New DataColumn("CurrencyValue", GetType(Double)))
'Make some rows and put some sample data in
For i = 1 To 5
dr = dt.NewRow()
dr(0) = "Item " + i.ToString()
If (i Mod 2 <> 0) Then
dr(1) = True
Else
dr(1) = False
End If
dr(2) = 1.23 * (i + 1)
'add the row to the datatable
dt.Rows.Add(dr)
Next
'return a DataView to the DataTable
CreateDataSource = New DataView(dt)
End Function
Sub Page_Load(sender as Object, e as EventArgs)
if not IsPostBack then
DataGrid4.DataSource = CreateDataSource()
DataGrid4.DataBind()
end if
End Sub
Private Sub DataGrid4_ItemDataBound(ByVal sender As Object, ByVal e As
System.Web.UI.WebControls.DataGridItemEventArgs)
trace.warn("in itemdatabound")
Select Case e.Item.ItemType
Case ListItemType.Item, ListItemType.AlternatingItem
Dim editButton As LinkButton = New LinkButton()
editButton = CType(e.Item.Cells(0).Controls(0), LinkButton)
editButton.Attributes.Add("name", "#" & editButton.UniqueID)
Case ListItemType.EditItem
Dim UpdateButton As LinkButton = New LinkButton()
UpdateButton = CType(e.Item.Cells(0).Controls(0),
LinkButton)
UpdateButton.Attributes.Add("name", "#" &
UpdateButton.UniqueID)
End Select
End Sub
Private Sub DataGrid1_ItemDataBound(ByVal sender As Object, ByVal e As
System.Web.UI.WebControls.DataGridItemEventArgs)
trace.warn("in itemdatabound")
Select Case e.Item.ItemType
Case ListItemType.Item, ListItemType.AlternatingItem
Dim editButton As LinkButton = New LinkButton()
editButton = CType(e.Item.Cells(0).Controls(0), LinkButton)
editButton.Attributes.Add("name", "#" & editButton.UniqueID)
Case ListItemType.EditItem
Dim UpdateButton As LinkButton = New LinkButton()
UpdateButton = CType(e.Item.Cells(0).Controls(0),
LinkButton)
UpdateButton.Attributes.Add("name", "#" &
UpdateButton.UniqueID)
End Select
End Sub
Private Sub DataGrid4_EditCommand(ByVal source As Object, ByVal e As
System.Web.UI.WebControls.DataGridCommandEventArgs )
trace.warn("in editCommand")
DataGrid4.DataSource = CreateDataSource()
DataGrid4.DataBind()
End Sub
Private Sub DataGrid4_CancelCommand(ByVal source As Object, ByVal e As
System.Web.UI.WebControls.DataGridCommandEventArgs )
trace.warn("in cancelCommand")
DataGrid4.EditItemIndex = -1
DataGrid4.DataSource = CreateDataSource()
DataGrid4.DataBind()
End Sub
Private Sub DataGrid4_UpdateCommand(ByVal source As Object, ByVal e As
System.Web.UI.WebControls.DataGridCommandEventArgs )
DataGrid4.EditItemIndex = -1
DataGrid4.DataSource = CreateDataSource()
DataGrid4.DataBind()
End Sub
</script>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>View Positions</title>
<style type="text/css">
body {
margin:0;
padding:0;
}
</style>
</head>
<body>
<form method="post" name="form1" class="BodyText" runat="server">
<div align="left"><a href="addPositions.aspx">Add New Positions</a></div>
<p>
<asp:DataGrid id="DataGrid4" runat="server" BorderColor="#CC9966"
BorderStyle="None" BorderWidth="1px" BackColor="White" CellPadding="4"
onItemDataBound="DataGrid4_ItemDataBound"
onEditCommand="DataGrid4_EditCommand"
onUpdateCommand="DataGrid4_UpdateCommand"
onCancelCommand="DataGrid4_CancelCommand">
<HeaderStyle HorizontalAlign="center" BackColor="#c0edee"
ForeColor="#2FABAD" Font-Name="Verdana, Arial, Helvetica, sans-serif"
Font-Bold="true"/>
<ItemStyle BackColor="#F2F2F2" Font-Name="Verdana, Arial, Helvetica,
sans-serif"/>
<AlternatingItemStyle BackColor="#E5E5E5" Font-Name="Verdana, Arial,
Helvetica, sans-serif" />
<FooterStyle HorizontalAlign="center" BackColor="#E8EBFD"
ForeColor="#3D3DB6" Font-Name="Verdana, Arial, Helvetica, sans-serif"
Font-Bold="true"/>
<PagerStyle BackColor="white" Font-Name="Verdana, Arial, Helvetica,
sans-serif" />
<Columns>
<asp:EditCommandColumn ButtonType="LinkButton"
UpdateText="Update"
CancelText="Cancel"
EditText="Edit">
</asp:EditCommandColumn>
</Columns>
<PagerStyle HorizontalAlign="Center" ForeColor="#330099"
BackColor="#FFFFCC">
</PagerStyle>
</asp:DataGrid><br>
</form>
</body>
</html>
************************************************** ***************************
Both IE and Mozilla are identical
2nd: adding the font-size=smaller to the DataGrid
************************************************** *****************************
<%@ Page Language="VB" Debug="true" ContentType="text/html"
ResponseEncoding="iso-8859-1" %>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" >
<%@ Import Namespace="System.Collections" %>
<%@ Import Namespace="System.Data" %>
<%@ Import Namespace="System.Data.SqlClient" %>
<script runat="server">
Function CreateDataSource() As ICollection
Dim dt As DataTable
Dim dr As DataRow
Dim i As Integer
'create a DataTable
dt = New DataTable()
dt.Columns.Add(New DataColumn("StringValue", GetType(String)))
dt.Columns.Add(New DataColumn("BoolValue", GetType(Boolean)))
dt.Columns.Add(New DataColumn("CurrencyValue", GetType(Double)))
'Make some rows and put some sample data in
For i = 1 To 5
dr = dt.NewRow()
dr(0) = "Item " + i.ToString()
If (i Mod 2 <> 0) Then
dr(1) = True
Else
dr(1) = False
End If
dr(2) = 1.23 * (i + 1)
'add the row to the datatable
dt.Rows.Add(dr)
Next
'return a DataView to the DataTable
CreateDataSource = New DataView(dt)
End Function
Sub Page_Load(sender as Object, e as EventArgs)
if not IsPostBack then
DataGrid4.DataSource = CreateDataSource()
DataGrid4.DataBind()
end if
End Sub
Private Sub DataGrid4_ItemDataBound(ByVal sender As Object, ByVal e As
System.Web.UI.WebControls.DataGridItemEventArgs)
trace.warn("in itemdatabound")
Select Case e.Item.ItemType
Case ListItemType.Item, ListItemType.AlternatingItem
Dim editButton As LinkButton = New LinkButton()
editButton = CType(e.Item.Cells(0).Controls(0), LinkButton)
editButton.Attributes.Add("name", "#" & editButton.UniqueID)
Case ListItemType.EditItem
Dim UpdateButton As LinkButton = New LinkButton()
UpdateButton = CType(e.Item.Cells(0).Controls(0),
LinkButton)
UpdateButton.Attributes.Add("name", "#" &
UpdateButton.UniqueID)
End Select
End Sub
Private Sub DataGrid1_ItemDataBound(ByVal sender As Object, ByVal e As
System.Web.UI.WebControls.DataGridItemEventArgs)
trace.warn("in itemdatabound")
Select Case e.Item.ItemType
Case ListItemType.Item, ListItemType.AlternatingItem
Dim editButton As LinkButton = New LinkButton()
editButton = CType(e.Item.Cells(0).Controls(0), LinkButton)
editButton.Attributes.Add("name", "#" & editButton.UniqueID)
Case ListItemType.EditItem
Dim UpdateButton As LinkButton = New LinkButton()
UpdateButton = CType(e.Item.Cells(0).Controls(0),
LinkButton)
UpdateButton.Attributes.Add("name", "#" &
UpdateButton.UniqueID)
End Select
End Sub
Private Sub DataGrid4_EditCommand(ByVal source As Object, ByVal e As
System.Web.UI.WebControls.DataGridCommandEventArgs )
trace.warn("in editCommand")
DataGrid4.DataSource = CreateDataSource()
DataGrid4.DataBind()
End Sub
Private Sub DataGrid4_CancelCommand(ByVal source As Object, ByVal e As
System.Web.UI.WebControls.DataGridCommandEventArgs )
trace.warn("in cancelCommand")
DataGrid4.EditItemIndex = -1
DataGrid4.DataSource = CreateDataSource()
DataGrid4.DataBind()
End Sub
Private Sub DataGrid4_UpdateCommand(ByVal source As Object, ByVal e As
System.Web.UI.WebControls.DataGridCommandEventArgs )
DataGrid4.EditItemIndex = -1
DataGrid4.DataSource = CreateDataSource()
DataGrid4.DataBind()
End Sub
</script>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>View Positions</title>
<style type="text/css">
body {
margin:0;
padding:0;
}
</style>
</head>
<body>
<form method="post" name="form1" class="BodyText" runat="server">
<div align="left"><a href="addPositions.aspx">Add New Positions</a></div>
<p>
<asp:DataGrid id="DataGrid4" runat="server" BorderColor="#CC9966"
BorderStyle="None" BorderWidth="1px" BackColor="White" CellPadding="4"
onItemDataBound="DataGrid4_ItemDataBound"
onEditCommand="DataGrid4_EditCommand"
onUpdateCommand="DataGrid4_UpdateCommand"
onCancelCommand="DataGrid4_CancelCommand">
<HeaderStyle HorizontalAlign="center" BackColor="#c0edee"
ForeColor="#2FABAD" Font-Name="Verdana, Arial, Helvetica, sans-serif"
Font-Bold="true" Font-Size="Smaller"/>
<ItemStyle BackColor="#F2F2F2" Font-Name="Verdana, Arial, Helvetica,
sans-serif" Font-Size="Smaller"/>
<AlternatingItemStyle BackColor="#E5E5E5" Font-Name="Verdana, Arial,
Helvetica, sans-serif" Font-Size="Smaller"/>
<FooterStyle HorizontalAlign="center" BackColor="#E8EBFD"
ForeColor="#3D3DB6" Font-Name="Verdana, Arial, Helvetica, sans-serif"
Font-Bold="true" Font-Size="Smaller"/>
<PagerStyle BackColor="white" Font-Name="Verdana, Arial, Helvetica,
sans-serif" />
<Columns>
<asp:EditCommandColumn ButtonType="LinkButton"
UpdateText="Update"
CancelText="Cancel"
EditText="Edit">
</asp:EditCommandColumn>
</Columns>
<PagerStyle HorizontalAlign="Center" ForeColor="#330099"
BackColor="#FFFFCC">
</PagerStyle>
</asp:DataGrid><br>
</form>
</body>
</html>
************************************************** ********************************
Both Mozilla and IE should look the same, but smaller.
3rd: adding the style a {smaller}
************************************************** *********************************
<%@ Page Language="VB" Debug="true" ContentType="text/html"
ResponseEncoding="iso-8859-1" %>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" >
<%@ Import Namespace="System.Collections" %>
<%@ Import Namespace="System.Data" %>
<%@ Import Namespace="System.Data.SqlClient" %>
<script runat="server">
Function CreateDataSource() As ICollection
Dim dt As DataTable
Dim dr As DataRow
Dim i As Integer
'create a DataTable
dt = New DataTable()
dt.Columns.Add(New DataColumn("StringValue", GetType(String)))
dt.Columns.Add(New DataColumn("BoolValue", GetType(Boolean)))
dt.Columns.Add(New DataColumn("CurrencyValue", GetType(Double)))
'Make some rows and put some sample data in
For i = 1 To 5
dr = dt.NewRow()
dr(0) = "Item " + i.ToString()
If (i Mod 2 <> 0) Then
dr(1) = True
Else
dr(1) = False
End If
dr(2) = 1.23 * (i + 1)
'add the row to the datatable
dt.Rows.Add(dr)
Next
'return a DataView to the DataTable
CreateDataSource = New DataView(dt)
End Function
Sub Page_Load(sender as Object, e as EventArgs)
if not IsPostBack then
DataGrid4.DataSource = CreateDataSource()
DataGrid4.DataBind()
end if
End Sub
Private Sub DataGrid4_ItemDataBound(ByVal sender As Object, ByVal e As
System.Web.UI.WebControls.DataGridItemEventArgs)
trace.warn("in itemdatabound")
Select Case e.Item.ItemType
Case ListItemType.Item, ListItemType.AlternatingItem
Dim editButton As LinkButton = New LinkButton()
editButton = CType(e.Item.Cells(0).Controls(0), LinkButton)
editButton.Attributes.Add("name", "#" & editButton.UniqueID)
Case ListItemType.EditItem
Dim UpdateButton As LinkButton = New LinkButton()
UpdateButton = CType(e.Item.Cells(0).Controls(0),
LinkButton)
UpdateButton.Attributes.Add("name", "#" &
UpdateButton.UniqueID)
End Select
End Sub
Private Sub DataGrid1_ItemDataBound(ByVal sender As Object, ByVal e As
System.Web.UI.WebControls.DataGridItemEventArgs)
trace.warn("in itemdatabound")
Select Case e.Item.ItemType
Case ListItemType.Item, ListItemType.AlternatingItem
Dim editButton As LinkButton = New LinkButton()
editButton = CType(e.Item.Cells(0).Controls(0), LinkButton)
editButton.Attributes.Add("name", "#" & editButton.UniqueID)
Case ListItemType.EditItem
Dim UpdateButton As LinkButton = New LinkButton()
UpdateButton = CType(e.Item.Cells(0).Controls(0),
LinkButton)
UpdateButton.Attributes.Add("name", "#" &
UpdateButton.UniqueID)
End Select
End Sub
Private Sub DataGrid4_EditCommand(ByVal source As Object, ByVal e As
System.Web.UI.WebControls.DataGridCommandEventArgs )
trace.warn("in editCommand")
DataGrid4.DataSource = CreateDataSource()
DataGrid4.DataBind()
End Sub
Private Sub DataGrid4_CancelCommand(ByVal source As Object, ByVal e As
System.Web.UI.WebControls.DataGridCommandEventArgs )
trace.warn("in cancelCommand")
DataGrid4.EditItemIndex = -1
DataGrid4.DataSource = CreateDataSource()
DataGrid4.DataBind()
End Sub
Private Sub DataGrid4_UpdateCommand(ByVal source As Object, ByVal e As
System.Web.UI.WebControls.DataGridCommandEventArgs )
DataGrid4.EditItemIndex = -1
DataGrid4.DataSource = CreateDataSource()
DataGrid4.DataBind()
End Sub
</script>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>View Positions</title>
<style type="text/css">
body {
margin:0;
padding:0;
}
a {
font-size:smaller;
}
</style>
</head>
<body>
<form method="post" name="form1" class="BodyText" runat="server">
<div align="left"><a href="addPositions.aspx">Add New Positions</a></div>
<p>
<asp:DataGrid id="DataGrid4" runat="server" BorderColor="#CC9966"
BorderStyle="None" BorderWidth="1px" BackColor="White" CellPadding="4"
onItemDataBound="DataGrid4_ItemDataBound"
onEditCommand="DataGrid4_EditCommand"
onUpdateCommand="DataGrid4_UpdateCommand"
onCancelCommand="DataGrid4_CancelCommand">
<HeaderStyle HorizontalAlign="center" BackColor="#c0edee"
ForeColor="#2FABAD" Font-Name="Verdana, Arial, Helvetica, sans-serif"
Font-Bold="true" Font-Size="Smaller"/>
<ItemStyle BackColor="#F2F2F2" Font-Name="Verdana, Arial, Helvetica,
sans-serif" Font-Size="Smaller"/>
<AlternatingItemStyle BackColor="#E5E5E5" Font-Name="Verdana, Arial,
Helvetica, sans-serif" Font-Size="Smaller"/>
<FooterStyle HorizontalAlign="center" BackColor="#E8EBFD"
ForeColor="#3D3DB6" Font-Name="Verdana, Arial, Helvetica, sans-serif"
Font-Bold="true" Font-Size="Smaller"/>
<PagerStyle BackColor="white" Font-Name="Verdana, Arial, Helvetica,
sans-serif" />
<Columns>
<asp:EditCommandColumn ButtonType="LinkButton"
UpdateText="Update"
CancelText="Cancel"
EditText="Edit">
</asp:EditCommandColumn>
</Columns>
<PagerStyle HorizontalAlign="Center" ForeColor="#330099"
BackColor="#FFFFCC">
</PagerStyle>
</asp:DataGrid><br>
</form>
</body>
</html>
************************************************** ****************************
Here both IE and Mozilla get smaller (IE is smaller the Mozilla, because of
the previous setting of the font-size in the DataGrid)
Very confusing and time wasting.
The solutions seems to be to NEVER use font-size in the DataGrid if you
don't know what browser you are going to use. What I was finding that in IE
I was not able to see the link at all, it was so small.
BTW, Netscape works the same way as Mozilla.
Thanks,
Tom.
"tshad" <ts**********@ftsolutions.com> wrote in message
news:OR**************@TK2MSFTNGP14.phx.gbl...
"Bill Borg" <Bi******@discussions.microsoft.com> wrote in message
news:5C**********************************@microsof t.com... Tom, I played around a bit and couldn't duplicate your problem, but I do
know
that relative sizes (e.g. "smaller" vs. "small") are always relative to
the
parent element, not to some absolute, so I think a smaller <a> within a
smaller <td> is going to be "twice" as small (although I couldn't get
this to
happen in IE6, which doesn't say much for the theory). Do you have the
same
problem if you go with absolute sizes (e.g. 12px, small, etc.)?
I'll have to play with it some more and get a small example to see if I
can recreate it and post it. I don't know about fixed sizes.
I know I am using IE6 and that is where it is happening
But I know I have other links on my screen (and they are all in TD's in
some form or another) that don't change and match Mozilla's size. Only
inside of my DataGrid are they a problem and only on IE.
Thanks,
Tom
Bill
"tshad" wrote:
I am having trouble with links in my DataGrid.
I have Links all over my page set to smaller and they are consistant all
over the page in both Mozilla and IE, except for the DataGrid.
Here is a snippet from my .css file:
***************************
body {
margin:0;
padding:0;
}
th {
background-color:#2FABAD;
color:white;
}
td {
font-size:smaller;
}
a {
font-size:smaller;
}
********************************************
I only have the font-size set in my "td" and "a" rules.
This makes everything work in both IE and Mozilla outside of the
Datagrid
and the links are the same size in the Datagrid for Mozilla.
In IE, however the links always seem to be smaller than all the other
links.
The text, however, is always the same size in both IE and Mozilla.
If I remove the "td" or "a", all the links get larger (as I would
expect),
but in IE the links in the DataGrid is still smaller than the other
links on
the page.
It is almost as if the Page is setting the links to smaller and the
DataGrid
is setting smaller to the smaller size (doubling the smaller in
essence) -
But only in IE.
What is causing this and how do I get around it?
Thanks,
Tom
