Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 5 of 5
  1. #1
    Regular Coder harlequin2k5's Avatar
    Join Date
    Sep 2005
    Location
    Holiday, FL
    Posts
    635
    Thanks
    18
    Thanked 0 Times in 0 Posts

    Need Help to Display Output List in 2 columns

    ok I've now worked too hard on this site with css to start using tables *chuckles*

    Here's my question -

    When I get ready to put up the board members page I would prefer to have the list display in 2 columns instead of just one long list

    there are 7 officer titles, one of them being Associate Director - there are 19 AD's so instead of one long output list of 19 AD's I'd prefer to have like 10 in one column and 9 in another

    There are 29 board members total

    Any thoughts? If this would require an array would someone be able to help me construct one? I've never done one before...

    Thanks all!
    Last edited by harlequin2k5; 12-02-2005 at 05:02 AM.

  • #2
    New Coder
    Join Date
    Oct 2005
    Posts
    30
    Thanks
    0
    Thanked 1 Time in 1 Post
    I feel the same way about my site. As far as my knowledge goes, a table is the only way to do it, but I have little experience compared to most people here.

  • #3
    Regular Coder harlequin2k5's Avatar
    Join Date
    Sep 2005
    Location
    Holiday, FL
    Posts
    635
    Thanks
    18
    Thanked 0 Times in 0 Posts
    Would be nice if you could just make a div where the "overflow" would go into another column instead of scrolling

    I know I hate to scroll through a whole page for anything - unless I'm going through a list of prices and I haven't narrowed the search

    I just think back to the old days of using MS Publisher and being able to use columns that way...

  • #4
    Regular Coder harlequin2k5's Avatar
    Join Date
    Sep 2005
    Location
    Holiday, FL
    Posts
    635
    Thanks
    18
    Thanked 0 Times in 0 Posts

    Board Members page list


  • #5
    Senior Coder
    Join Date
    Nov 2003
    Location
    Minneapolis, MN
    Posts
    2,879
    Thanks
    2
    Thanked 65 Times in 56 Posts
    The easiest way is to give the <ul> and <li> a fixed width and use floats:
    Code:
    HTML:
    <ul>
    	<li>link item</li>
    	<li>link item</li>
    	<li>link item</li>
    	<li>link item</li>
    	<li>link item</li>
    	<li>link item</li>
    	<li>link item</li>
    	<li>link item</li>
    	<li>link item</li>
    	<li>link item</li>
    </ul>
    
    CSS:
    ul	{
    	width: 200px;
    }
    
    li	{
    	width: 100px;
    	float: left;
    }
    From there you can add your margins, padding, style, etc., etc....

    Hope this helps…


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •