Click to See Complete Forum and Search --> : List - tricky goal


DanDigiMan
01-09-2004, 01:36 PM
Wondering if its possible to reproduce a table like structure that has 5 columns and 1 row using a list. The trick is that the first row, only the first, has to be split in two.

ie.

_________
A
_ C D E F
B
_________

pyro
01-09-2004, 01:55 PM
Why do you need/want to use a list?

DanDigiMan
01-09-2004, 02:02 PM
I forgot to mention, the information that needs to be contained in this specific sequence are a series of links.

At the present time, I'm using a table and I was wondering if I could do this using a list. I figured it was impossible, and I had to ask :D

Furthermore, I'm using a javascript for the onclick of the TD so that the user doesn't necessarily have to click on the link itself to launch the link, that he just needs to put the cursor in the cell. Its a pain to maintain both javascript and HTML. If I was able to use lists, this would solve the issue of having to do a javascript onclick and HTML link. I say this because links, if they are set wider than the text, putting the cursor on the empty space will still activate the hover of the link and by clicking will also launch the link.

Sure hope this makes sense...

pyro
01-09-2004, 02:11 PM
Building off of my post here (http://forums.webdeveloper.com/showthread.php?s=&postid=130630#post130630):

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Example</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">

<style type="text/css">
body {
margin: 0;
padding: 0;
}
#nav {
width: 100%;
}
#nav ul {
margin: 0;
padding: 0;
list-style-type: none;
}
#nav ul li {
float: left;
width: 25%;
text-align: center;
}
#nav ul li#n_last {
margin-left: -1px; /* Darn IE */
}
html>body #nav ul li#n_last {
margin-left: 0; /* Back to normal */
}
#nav ul li a {
height: 50px;
line-height: 50px;
display: block;
background: #eee;
}
#nav ul li#first a {
height: 25px;
line-height: 25px;
}
</style>

</head>
<body>
<div id="nav">
<ul>
<li id="first"><a href="#">One</a><a href="#">Half</a></li>
<li><a href="#">Two</a></li>
<li><a href="#">Three</a></li>
<li id="n_last"><a href="#">Four</a></li>
</ul>
</div>
</body>
</html>

DanDigiMan
01-09-2004, 02:15 PM
OMG! Thanks!

I guess everything is possible! LOL

pyro
01-09-2004, 02:18 PM
Happy to help. ;)

DanDigiMan
01-09-2004, 03:29 PM
I noticed that you didn't indicate the unit px in some instance? It isn't mandatory?

For instance, I tend to use: margin: 0px 0px 0px 0px; is this the optimal way to write it? Or can I simply use margin 0 0 0 0; ?

In any case, today is turning out to be a good day for CSS coding! :D

spufi
01-09-2004, 04:48 PM
If you are using 0, then you don't have to say what type of measurement you are using because 0 is just 0.

pyro
01-09-2004, 05:02 PM
As spufi said, 0 is 0, so you do not need to specify a unit of measure. For all other values, you must specify it. IMO it is redundant to spcify a unit if you want 0, as 0 px is the same as 0 em or 0%. Also, margin: 0; is the same as margin: 0 0 0 0; If you want all values the same, you only need to specify one.

DanDigiMan
01-13-2004, 07:15 AM
Great... thanks! I guess it makes sense ! LOL

pyro
01-13-2004, 08:48 AM
lol :p