Can I render in tabular form with <ul> and <li> in html?

css, html, json, opensocial

Solution

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>Untitled Page</title>
    <style type="text/css">

ul{
    margin: 0 auto;
    padding: 0;
}


/* The wider the #list_wrapper is, the more columns will fit in it */
#list_wrapper{
    width: 200px
}

/* The wider this li is, the fewer columns there will be */
    ul.multiple_columns li{
        text-align: left;
        float: left;
        list-style: none;
        height: 30px;
        width: 50px;
    }

    </style>
</head>
<body>
    <form id="form1" runat="server">
    <div>
    <div id="list_wrapper">
    <ul class="multiple_columns">
        <li>One</li>
        <li>Two</li>
        <li>Three</li>
        <li>Four</li>
        <li>Five</li>
        <li>Six</li>
        <li>Seven</li>
        <li>Eight</li>
        <li>Nine</li>
    </ul>
</div>

<!-- Here's the CSS -->


    </div>
    </form>
</body>
</html>

You can get more information in http://mirificampress.com/permalink/the_amazing_li

Problem

I want to display data in a tabular form using `<ul>` and `<li>` as shown below: ``` mydata mydata mydata mydata mydata mydata mydata mydata mydata mydata mydata mydata mydata mydata mydata mydata mydata mydata ``` I cannot use `<table>`; I have to use `<ul> <li>`. Actually the problem is with OpenSocial while rendering data coming from JSON `<li repeater=${Exp}>`

Original source