how to create a table using DIV tag : The Official Microsoft ASP.NET Forums

Reply

kharearchana

0 Points

how to create a table using DIV tag

May 01, 2012 08:47 AM|LINK

I want to create a table using DIV tag. My code is following:

output is coming like this

<form id="form1"> <div class="divtable"> <div class="headrow"> <div class="divcol">Cust_no</div> <div class="divcol">Name</div> <div class="divcol">address</div> </div> <div class="divrow"> <div class="divcol">001</div> <div class="divcol">poonam</div> <div class="divcol">ashok vihar</div> </div> <div class="divrow"> <div class="divcol">002</div> <div class="divcol">reena</div> <div class="divcol">preet vihar</div> </div> <div class="divcol"></div> <div class="divcol">Every value is coming in only one column not in different column. Can somebody correct my code.</div> </div> <div class="divcol"></div> <div class="divcol">thanks.</div> </form>

Reply

chiragtoad

Member

212 Points

51 Posts

Re: how to create a table using DIV tag

May 01, 2012 08:49 AM|LINK

check this link this may help you out

http://www.webmasterworld.com/html/4065001.htm

Reply

Ruchira

All-Star

43040 Points

7032 Posts

MVP

Re: how to create a table using DIV tag

May 01, 2012 01:49 PM|LINK

Hello,

I formatted your code a bit. Look at it. :)

<html>
<head>
<style type="text/css">
div
{
   border:1px solid;
}
.divtable
{
    display:table;
}
.divrow
{
    display:table-row;
}
.divcol
{
    display:table-cell;
    width:100px;
}
.headrow
{
    display:table-caption;
}
.content
{
    display:table-cell;
    width:100px;
}
</style>
    <title></title>
</head>
<body>
    <form id="form1" runat="server">
  <div class="divtable">
    <div class="headrow">
     <div class="divcol">Cust_no</div>
     <div class="divcol">Name</div>
     <div class="divcol">address</div>
    </div>
    <div class="divrow">
        <div class="content">001</div>
        <div class="content">poonam</div>
        <div class="content">ashok vihar</div>
     </div>
    <div class="divrow">
        <div class="content">002</div>
        <div class="content">reena</div>
         <div class="content">preet vihar</div>
    </div>
  </div>
    </form>
</body>
</html>

Please 'Mark as Answer' if this post helps you.

My Tech blog | My YouTube Channel