Link to home
Start Free TrialLog in
Avatar of Jesper Christensen
Jesper Christensen

asked on

ul list both horizontal and vertical

Hi.

How can I make a ul list both horizontal and vertical from a database in a datalist like this:
id1        id2        id3
id4        id5        id6
id7        id6        id9
Avatar of pschrama
pschrama

If I take your question literally, you could use a UL list in the following way.
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="UnnumberedList.aspx.cs"
    Inherits="Experimentation.Pages.UnnumberedList" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <style type="text/css">
        .bulletList
        {
            list-style-type: none;
        }
        .bulletList li
        {
            float: left;
            margin-left: 10px;
        }
        .bulletList li.firstInRow
        {
            clear: both;
        }
    </style>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <asp:BulletedList ID="BulletedList1" runat="server" CssClass="bulletList">
        </asp:BulletedList>
    </div>
    </form>
</body>
</html>

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;

namespace Experimentation.Pages
{
    public partial class UnnumberedList : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {
            for (int i = 0; i < 9; i++)
            {
                ListItem li = new ListItem("id" + (i + 1).ToString());

                if (i % 3 == 0)
                    li.Attributes.Add("class", "firstInRow");

                BulletedList1.Items.Add(li);
            }
        }
    }
}

Open in new window

ASKER CERTIFIED SOLUTION
Avatar of pschrama
pschrama

Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
Avatar of Jesper Christensen

ASKER

pschrama: Sorry for my late response time, didnt see your answer.
I will check it out tonight, thanks :)