Latest Lists - HTML CSS LISTS IN-LINE????

HTML CSS LISTS IN-LINE????

How can i change my current CSS code to work right? I want the four blocks to run 2 across. then go down a line and run two more across in the current format. I know i could use tables, but i'm trying to do this with CSS! And using Lists!!!! Any help please. Here's my code so far: <html> <head> <style type="text/css"> ul { display: run-in; height: 150px; width: 150px; outline-style: solid; outline-width: thin; position:relative; left: 10px; } li {display: inline} </style> </head> <body> <ul> <li><img width="100" height="100" src="image.jpg"><br /> <li>line 1</li> <li>line 2</li> </ul> <ul> <li><img width="100" height="100" src="image.jpg"><br /> <li>line 1</li> <li>line 2</li> </ul> <ul> <li><img width="100" height="100" src="image.jpg"><br /> <li>line 1</li> <li>line 2</li> </ul> <ul> <li><img width="100" height="100" src="image.jpg"><br /> <li>line 1</li> <li>line 2</li> </ul> </body> </html>

Public Comments

ul { display: inline; height: 150px; width: 150px; border:solid 1px #000000; position:relative; margin-left:10px } ul li {display: inline} might work the ul need to be a little bit bigger than you contain block but wide enought to fit 320px across this will be you first 2 blocks then the next 2 will apear on the next line on there own.