Forum Moderators: open
I am having a tricky problem with tables.
I have a table with one row and 1 cell. In the cell i have a list of names and what i want to have is another small table to the right of the name list.
Like so
<table>
<tr>
<td>
Hi<br>
there<br>
you<br>
sexy<br>
thing<br>
<table>
<tr>
<td>
another<br>
list<br>
to<br>
right<br>
please<br>
</td>
</tr>
</table>
</td>
</tr>
</table>
Ok,
this makes a table(didn't bother with attributes just making a point) with a smaller table below the list.
I want to move the small table up and to the right so it is next to the first list.
I have done this with css relative positioning and can get the table in the right spot. But, there is still all that empty space at the bottom where the small table used to be. How can i get rid of this empty space? height=100 doesn't work for cells.
I dont get it.
Hope that makes sense.
An answer to this prob would be more than greatly appreciated :)
Thankyou thankyou thankyou
<ul>
<li>Item 1</li>
<li>Item 2</li>
<li>Item 3</li>
</ul>
Adjust extra unwanted space at the bottom by assigning a class and controlling it with CSS.
Yeah i meant a normal list not html.
The trouble with using another cell is that it breaks my nice row with cellspacing and padding up, i need it to look like one cell. How do you adjust whitespace with css?
Thanks
Are the list of items on the right related to the list of names on the left? Are the items broken up by <br>s because they're seperate things or do you just want the one word per line effect?
Appreciate all your help :)
I'll try draw a diagram of how my table should look.
-----------------------------------------------------
Name: Chris ¦This
Age: 21 ¦is
Country: US ¦table
Phone: 23423 ¦2
Eyes: blue ¦move up from left corner
-------------------------
This is space left over
from moving table 2
up there with css
-----------------------------------------------------
How it should look:
-----------------------------------------------------
Name: Chris ¦This
Age: 21 ¦is
Country: US ¦table
Phone: 23423 ¦2
Eyes: blue ¦move up from left corner
-------------------------
-----------------------------------------------------
Just need to get rid of unwanted space.
Is this possible?
I'll try photoshop a picture and link it to this post.
Imagin the "this is table 2" text move left in a box.
<html>
<body>
<table bgcolor=#F5F5F5 border=1 BORDERCOLOR=#D6D6D6
cellpadding=5 cellspacing=5 style=position:relative;top:-15px;>
<tr>
<td width=500 bgcolor=#DCDCDC><b>Showing All Projects</b></td>
</tr>
<tr>
<td width=500 height=20 bgcolor=#DCDCDC>
<a href =$self$pid><b>$title</b></a>
<br>Project #: <span style=position:relative;left:25px;color:black;>$pid</span><br>
Category: <span style=position:relative;left:25px;color:black;>
$category</span><br>
Subcategory:<span style=position:relative;left:5px;color:black;>
$subcategory</span><br>
Budget:<span style=position:relative;left:34px;color:black;>
$budget</span><br>
Deadline:<span style=position:relative;left:26px;color:black;>$deadline</span><br>
<table bgcolor=#ffffff border=1 BORDERCOLOR=#D6D6D6
cellpadding=4 style=position:relative;top:-110px;left:280px;>
<tr>
<td width=150 height=10 bgcolor=#DDDDDD>
<center><b>Bidding Details</b></center>
</td>
</tr>
<tr>
<td width=150 height=60 bgcolor=#ffffff>
Buyer:<br>
Location:<br>
Bids:<br>
Ends:
</td>
</tr>
</table>
</td>
</tr>
</table>
</body>
</html>
This is killing me :)
This does nothing.
I would hate to appear desperate, but i am :D
I know this can be done because i have seen it on numerous sites. There is a list of many table cells with the users details in a second smaller table.
How is this done?
There has to be at least one html genius here right?
Thanks again :D
<Sorry, no example websites>
[edited by: tedster at 5:11 am (utc) on Nov. 1, 2005]
<table id="master">
<tr>
<td>
<table id="table1">
<tr>
<td>Name:</td>
<td>Chris</td>
</tr>
<tr>
<td>Age:</td>
<td>21</td>
</tr>
<tr>
<td>Country:</td>
<td>US</td>
</tr>
<tr>
<td>Phone:</td>
<td>23423</td>
</tr>
<tr>
<td>Eyes:</td>
<td>blue</td>
</tr>
</table>
</td>
<td>
<table id="table2">
<tr>
<td>This</td>
</tr>
<tr>
<td>is</td>
</tr>
<tr>
<td>table</td>
</tr>
<tr>
<td>2</td>
</tr>
<tr>
<td>move up from left corner</td>
</tr>
</table>
</td>
</tr>
</table>
That isn't really what i'm after.
The second table needs to be in the fist tables cell without splittiong the cell.
Thanks anyway.
Genius still needed :D
i have seen it on numerous sites
At the risk of asking the obvious, have you studied the source code from one of those examples? There may be a combination of things creating the effect you are after -- for instance a rowspan attribute, or some css within the table cells.
My first take on your question would be this:
<table>
<tr>
<td style="vertical-align:top;>
Hi<br>
there<br>
you<br>
sexy<br>
thing<div style="float:right;">
<table>
<tr>
<td style="vertical-align:top;>
another<br>
list<br>
to<br>
right<br>
please
</td>
</tr>
</table>
</div></td>
</tr>
</table>
You may need to add style="margin:0; padding:0;" to the table cells to get the alignment you want.
e.g. second table code:
<table bgcolor=#ffffff border=1 BORDERCOLOR=#D6D6D6
cellpadding=4 align="right" style="margin-top: -7em;">
Suzy
10 Gold stars, hugs and kisses to Suzy :)
A true html genius.
Perfect :D
Thankyou!
