I'm struggling to style this table to look more like a traditional table. The issue I'm facing is removing the unwanted white space in the first row as shown in the image below:
HTML code snippet:
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="testmain.aspx.cs" Inherits="XRSTest.testmain" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<link href="css/bootstrap.css" rel="stylesheet" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>
</head>
<body>
<form id="form1" runat="server" style="background-color: white">
<div class="container mt-1">
<div class="row">
<div class="col-8 mt-5 d-inline flex-column h-100 border border-success" style="background-color: lightyellow">
Some content
</div>
<div id="Info" class="col-4 mt-5 d-inline d-flex flex-column h-100 justify-content-center border border-success" style="background-color: lightgray" runat="server">
<div class="container">
<div class="row">
<asp:Table runat="server" ID="PriceInc" class="container bg-white mt-5 mb-3" Style="font-size: 12px;">
<asp:TableRow CssClass="bg-primary row" style="font-size: 12px;">
<asp:TableCell>
Incluídos en precio final
</asp:TableCell>
</asp:TableRow>
</asp:Table>
</div>
</div>
</div>
</div>
</div>
</form>
</body>
</html>
C# code snippet:
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Data;
namespace XRSTest
{
public partial class testmain : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
DataColumn col1 = new DataColumn();
col1.ColumnName = "col1";
DataColumn col2 = new DataColumn();
col2.ColumnName = "col2";
DataColumn col3 = new DataColumn();
col3.ColumnName = "col3";
DataTable charges = new DataTable();
charges.Columns.Add(col1);
charges.Columns.Add(col2);
charges.Columns.Add(col3);
DataRow rows = charges.NewRow();
rows["col1"] = "ID";
rows["col2"] = "description";
rows["col3"] = "0.0";
charges.Rows.Add(rows);
DataRow asd = charges.NewRow();
asd["col1"] = "ID2";
asd["col2"] = "otherdescript";
asd["col3"] = "0.1";
charges.Rows.Add(asd);
foreach (DataRow row in charges.Rows)
{
TableCell inc = new TableCell();
if (float.Parse(row.Field<string>(2).Replace(".", ",")) < 1)
{
inc.Text = "incluído";
inc.Attributes.Add("class", "col-4 justify-content-end");
TableRow n = new TableRow();
TableCell name = new TableCell();
name.Text = "some text";
name.Attributes.Add("class", "col-8");
n.Cells.Add(name);
n.Cells.Add(inc);
PriceInc.Rows.Add(n);
}
}
}
}
}
How can I eliminate that unnecessary white space/margin/border in the table? I've experimented with different classes and styles without success. Your help is greatly appreciated.
EDIT1: As per a comment suggestion, I have provided a basic example code for reference.