|
Wrapping an unordered list into multiple columns?
How do I? So the list goes so far down, then wraps around again?
So if I wanted to display an alphabetically ordered list, across 3 columns, they would appear like this. A_______D________G B_______E________H C_______F________I Know what I mean? |
info from a db?
easily done in a few different ways - whynot use css - far easier and cleaner. total num rows / ceil 3 gives number of rows for each column load up info in an array 1____________(num = column1 + num rums)____________(nm = col2 + num rows) etc...... lots of ways to do it |
Quote:
http://sdezine.com/jewcat.html |
or ....
http://sdezine.com/jewcat2.html |
Quote:
|
Quote:
|
float the li left/right and assign it a width that's about 1/3rd of the area it'll be in and they'll fall in line.
|
Quote:
|
Quote:
|
Tables. Lots of Tables. Nested Tables inside other Nested Tables.
|
Quote:
|
Quote:
Thanks. |
nice tip, needed something like this awhile ago.
|
Quote:
|
Quote:
http://briancray.com/2009/09/04/word...-php-function/ modify it to fit your needs |
Quote:
|
Quote:
|
why can't you do it in a table? Why does it have to be an <UL>?
From a mysql query, let's say you retrieve 20 results (for nice round numbers for this eg) and you want 4 columns. Then you know there will be 5 rows. Code:
for ($i=0; $i<$numRows; $i++) {The code above will fit your 2x3, 3x4, 3x3, 4x5 anything stuff. It just won't handle things having eg 21 results - you need standard code to add cell padding for that. Kind of like taking a horse to water, but you can't make it drink ;) |
yup, this works nice
Code:
<?php |
Pure CSS:
Code:
<ul style="float: left; width: 21em; margin: 20px 0 1em 0; padding: 0; list-style: none; font-size: 1em; line-height: 1.3em;"> |
Quote:
|
Quote:
:upsidedow |
Quote:
The code I posted was not a full solution. It was an example of the columns. The inline-css is just for demonstration purposes. Obviously, someone would remove this and put it in their stylesheet. The other thing that would need to be done is some php for/if/while loops to get the data into colunns, not rows, similar to what bork posted, but not using tables. Try again. |
Quote:
PS, AJC.. you can handle this with jquery... see: http://codeasily.com/jquery/multi-co...st-with-jquery |
Quote:
|
I use this hack to display Categories in 2 columns, maybe you can apply it to Tags too?
http://www.blogohblog.com/10-wordpre...e-even-easier/ (2nd tutorial on the list) |
BAH NOOBS
<style type="text/css"> #dog { width: 750px; float: left; } #dog ul { margin: 0; padding: 0; float: left; } #dog li { list-style-type: none; float:left; padding: 0; margin: 0; width: 250px; } .dogin { width: 250px; float: left; } </style> <body> <div id="dog"> <ul> <div class="dogin"> <li>A</li> <li>B</li> <li>C</li> </div> <div class="dogin"> <li>D</li> <li>E</li> <li>F</li> </div> <div class="dogin"> <li>G</li> <li>H</li> <li>I</li> </div> </ul> </div> </body> </html> |
Quote:
2... that's manually breaking up the list, which isn't what he 's looking to do... 3... who's the noob? |
Quote:
2. i know he has never gaven a fuck if it validates because it is his own page just as long as he gets helped 3. i call him noob like he calls me scammer as a joke 4. manually insert your own foot into your ass 5. mind your own business noob |
Quote:
you can wave your "validation panty flag" high and mighty all you want but at the end of the day when that code is viewed by the engine it makes 0 difference. i bet your mom gets real impressed when you code a shit page and it validates but is broken in every browser. good for you... noob. |
I was hand coding cross browser identical pages before you handed out your first order of supersized fries.
Next time when someone points out one of your many mistakes, maybe try and learn from it instead of responding like a child. |
Quote:
i love how you avoided my point about validation because you have trouble admitting you are wrong. next time someone points out your flawed thinking learn from it. |
Quote:
In fact, the whole idea of what you're doing makes the list completely irrelevant and useless. He could pull out all the list code and just use the divs and it would still render the same. Not only are you breaking and voiding the list item to ALL major browsers, but you're negating the whole reason for him to be putting it into a list in the first place. Sorry dude, but you're code is wrong, let alone invalid. The End. |
And what you want to do is possible with CSS3. However most browsers don't support it yet, so by using it you'd be loosing the rendering for every one of your visitors.
|
Quote:
I didn't avoid yout point. It was as flawed as your code. Simple. Although your code may have worked.. It wasn't what he asked for. He specifically asked for an AUTOMATIC solution... Yours was a MANUAL hackjob. There is a difference. |
Quote:
it does render properly though and that is my point. and there is no "eventually". i can bet we come back in 5 years and it will still render. explain to me why it make the list irrelevant? the SE will see it is a list and organize its content. my point about validation is people over worry about the wrong things when it comes to it. yes i should have written a better code but lets talk about this: you can have a site that validates but have over 1000 extra divs. maybe we should start a new thread about this. i want to find out peoples views on validation. The Truth Hurts can come in there and bash me there. we are kinda crowding this thread now. |
Quote:
i never read AUTOMATIC solution in this thread. please post where it says that. or else i would have tried something different. i actually wanted to hear your opinion on validation. |
Quote:
sounds a bit like hating... Quote:
Quote:
Quote:
Doesn't mean it always does. doesn't mean i don't make use of hacks when necessary. |
Quote:
AHH ok my bad didnt notice it. i was just trying to help out. i just find alot of people misuse the reasoning behind validation. thats all i was trying to point out. i dont even run my pages through validation anymore im sure you dont as much either. after you have been coding for a while and do things "proper" it becomes less useful i find. i think it is a bad stepping stone for people who just validate and think pages are proper. im sure you have seen many pages where it validates and the code hurts your brain. same with the SEs. :) |
Quote:
http://csswizardry.com/2010/02/mutip...-using-one-ul/ |
| All times are GMT -7. The time now is 11:00 PM. |
Powered by vBulletin® Version 3.8.8
Copyright ©2000 - 2025, vBulletin Solutions, Inc.
©2000-, AI Media Network Inc123