Forum Moderators: not2easy
can someone transfer that into css for me please.
to view my positioning problem, please email me.
<No specifics, thanks. See TOS [webmasterworld.com]>
[edited by: DrDoc at 12:53 am (utc) on June 25, 2004]
Here's something for you to think about:
The following HTML elements are BLOCK LEVEL elements:
<hX>
<p>
<ul>
<li>
<div>
<a> (default inline but you can control its behavior)
<span> (same)
Now, why do I mention this?
When I was using tables, my old habit of making a menu was to do the following:
<table border="1">
<tr><td>Menu1</td>
<td>Menu2</td>
<td>Menu3</td>
</tr>
</table>
Here's that same menu in CSS:
<ul>
<li>Menu1
<li>Menu2
<li>Menu3
</ul>
With the following style definitions:
ul { margin: 0;}
li { display: inline; border:1px solid #000;}
What does this do?
The margin:0; on the ul element makes the UL stop breaking lines (you know the default behavior, how you have a space above the list?).
The display:inline; part makes each list item stop being on its own line.
The border declaration sets a border around each LI - all BLOCK LEVEL elements! They're little blocks, that's right! And so they actually can look like their own little <td>!
The inline declaration makes it so they nestle up next to each other.
Cool huh? Then you can set whatever heights and widths you want on each of them, with a little bit more CSS.