adding table inside itemtemplate

E

Edge

hi all,

I added a html table with 2 rows inside the itemtemplate of my gridview.
It works ok, but the table border never touches the border of my gridview
cell.

How should I do if I want the internal table and my grid cell share the same
border, so noone realizes that there is a table inside my cell?

TIA
-E
 
G

Guest

Edge,

By default, your datagrid will generate cells with padding - therefore your
inside table's border appears separately. Create a class for td that has no
padding and ensure that your ItemTemplate CssClass is set to it. Something
like:

<style>td.noPad{padding:0px}</style>
<asp:DataGrid ...>
<ItemTemplate CssClass="noPad" ..
</asp:DataGrid>

Unfortunately I do not have an ability to test it, but it is very likely to
fix your problem.
 
G

Guest

Could you post some code, say create a sample page that demonstrates your
problem - I will look into it - it seems to me as css task rather than
anything else - could be some other styles just cascade through ...
 
E

Edge

hi,
here it is the gridview and its css:

<asp:GridView ID="dgResults" runat="server" AutoGenerateColumns="False"
CssClass="GridTextCenter"
HeaderStyle-CssClass="GridHeaderCenter" Width="100%"
RowStyle-VerticalAlign="Top"
Visible="false" OnRowDataBound="dgResults_RowDataBound">
<Columns>
<asp:TemplateField HeaderStyle-BorderColor="black"
ItemStyle-BorderColor="black">
<HeaderTemplate>
No.
</HeaderTemplate>
<ItemTemplate>
<table><tr><td colspan=2><%# Eval("Row") %></td>
<tr><td>value a</td><td>value b</td></tr></table>
</ItemTemplate>
</asp:TemplateField>
....

..GridTextCenter
{
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
font-weight: normal;
color: #000000;
text-decoration: none;
line-height: 1.5;
text-align:center;
background-color:White;
border-color:Black;
}

..GridHeaderCenter
{
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
font-weight: bold;
color: black;
line-height: 2;
text-decoration: none;
background-color:#87cefa ;
text-align:center;

}
 
G

Guest

Try the following:

<style>.inTable{height:100%;width:100%;border:black 0px solid;}
td.noPad{padding:0px}</style>
<asp:DataGrid ...>
....
<asp:TemplateField HeaderStyle-BorderColor="black"
ItemStyle-CssClass="noPad">
<HeaderTemplate>
No.
</HeaderTemplate>
<ItemTemplate>
<table class="inTable"><tr><td colspan=2><%# Eval("Row") %></td>
<tr><td>value a</td><td>value b</td></tr></table>
</ItemTemplate>
</asp:TemplateField>
</asp:DataGrid>

I think that at least two things are happening: your ItemStyle uses 1px as
default padding, and because internal table is not stretched - it is
positioned at the center according to your stylesheet.
 
E

Edge

yep...worked very well :)
Thanks a lot
Edge


Sergey Poberezovskiy said:
Try the following:

<style>.inTable{height:100%;width:100%;border:black 0px solid;}
td.noPad{padding:0px}</style>
<asp:DataGrid ...>
...
<asp:TemplateField HeaderStyle-BorderColor="black"
ItemStyle-CssClass="noPad">
<HeaderTemplate>
No.
</HeaderTemplate>
<ItemTemplate>
<table class="inTable"><tr><td colspan=2><%# Eval("Row") %></td>
<tr><td>value a</td><td>value b</td></tr></table>
</ItemTemplate>
</asp:TemplateField>
</asp:DataGrid>

I think that at least two things are happening: your ItemStyle uses 1px as
default padding, and because internal table is not stretched - it is
positioned at the center according to your stylesheet.
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Members online

No members online now.

Forum statistics

Threads
473,743
Messages
2,569,478
Members
44,898
Latest member
BlairH7607

Latest Threads

Top