Stuck on Making a List

**sunxyre** · 04-20-2012, 07:12 AM

Hey, I'm stuck on something, can't seem to figure it out.

Trying to make it something like this:
http://i43.tinypic.com/2rc4jzs.jpg

But getting this instead:
http://i42.tinypic.com/20jzo0.jpg

My HTML looks like this:

Code:

<ul class="zxy">
	<li></li>
	<li></li>
	<li></li>
	<li></li>
	<li></li>
	<li></li>
	<li></li>
	<li></li>
</ul>

Basically I'm trying to make all the content in "zxy" to be centered. And each <li> to be 200px in width and height while having 5px space between each other. Help please.

**traq** · 04-20-2012, 04:24 PM

You might share your CSS...?

Your question is unclear.
Please provide more information, and be as specific as possible.

What do you want to accomplish?
What have you already tried?
What problems did you encounter?

Also, please be sure that you have included all relevant code and/or a link to the page in question.

**coothead** · 04-20-2012, 09:58 PM

Hi there sunxyre,

and a warm welcome to these forums.

Here is an example for you to try...

Code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
   "http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="language" content="english"> 
<meta http-equiv="Content-Style-Type" content="text/css">

<title>boxes</title>

<style type="text/css">
body {
    background-color:#f0f0f0;
 }
#boxes {
    width:828px;
    padding:10px 5px 5px 10px;
    border:1px solid #ccc;
    margin:20px auto 0;
    list-style-type:none;
    overflow:hidden;
    box-shadow:#666 6px 6px 12px;
    background-color:#fff;
 }
#boxes li {
    float:left;
    width:200px;
    height:200px;
    border:1px solid #ccc;
    margin:0 5px 5px 0;
    box-shadow:#666 2px 2px 2px;
    background-color:#fbfbfb;
 }
</style>

</head>
<body>

<ul id="boxes">
 <li></li>
 <li></li>
 <li></li>
 <li></li>
 <li></li>
 <li></li>
 <li></li>
 <li></li>
</ul>

</body>
</html>

coothead

**ajfmrf** · 04-21-2012, 01:05 AM

Coothead that looks very nice.Thanks for sharing more of your talent with us.

Thread: Stuck on Making a List

Thread Tools

Search Thread

Stuck on Making a List

Bookmarks

Bookmarks

Posting Permissions