View Full Version : Totally new question about tables
nycguurl
10-10-2007, 01:38 PM
Well, new for me anyway. Just wanted to differentiate that it's a question that didn't correlate to my other table thread...
Ok, is there some way to put a table on the same line as an image that's absolutely positioned? I can't seem to move the table there. :confused:
Is this a CSS question? Goodness, I hope so. I don't wanna get in trouble or anything.
boogyman
10-10-2007, 01:44 PM
what do you mean same line? like to the left or right of an image?
well you can position the table there then position the image to be next to it, or you can position both the table and the image, or you can create a table and include another cell to contain the image, or you could get away from absolute positioning and float the two elements, one to the left 1 to the right, but you would then need to make sure the next element is set to clear both of those elements.
<style type="text/css">
table#tableName {
float:left;
}
img#imgName {
float:right;
}
p#clearThem {clear:both}
</style>
<table id="tableName">
<tr><td>soemthing</td></tr>
</table>
<img src="img/path.ext" id="imgName">
<p id="clearThem">something else </p>
or
<table style="float:left">
<tr><td>soemthing</td></tr>
</table>
<img src="img/path.ext" style="float:right">
<p style="clear:both">something else </p>
nycguurl
10-10-2007, 11:13 PM
Ok, I like code #2. (Figures I would, LoL.)
I'll try that one first. Thanks!!! :o
nycguurl
10-11-2007, 07:06 PM
Ok, I implemented code #2 and it's gorgeous but something happened! :eek:
I changed the pictures I put on the floatie left to absolute position so I could make them tighter against the left margin... and suddenly all the page content below the table and images of that code ended up waaaaaay yonder down the page. Almost like if they're trying to stay away from that code. So how do I make it so that the rest of the page content wraps below that code?
boogyman
10-11-2007, 07:14 PM
dont position it with absolutes. take away the margins and padding
<table style="float:left;margin:0;padding:0">
...
</table>
<img src="url" style="float:left;margin:0;padding:0">
...
nycguurl
10-11-2007, 09:05 PM
Wow, I feel dumb but I'm just lost. :(
Now the table and the image are on the same side. What am I doing wrong:
<table style=style="float:right">
<tr><td>Stuff I'm putting in here</td></tr>
</table>
<img src="images/Money_stack.bmp" style="float:left;margin:0;padding:0">
<p style="clear:both">something else </p>
I also realized I want the image 10 pixels from the left instead of the default 12 or whatever it is.
I recognize that makes me look insane, but ummm... I have no defense for that. LoL. ;)
And one other question: What am I clearing? Is that "something else" the other content on my page?
I'm not really clearing it. When I try to add content to the page under the table and image, it jumps up between the table and image.
boogyman
10-12-2007, 01:09 PM
can you post a link to your page so we can trouble shoot better
and you are clearing the two floats. the paragraph should be preventing any other element from rendering between the two elements, but we should be able to tell more by a link to the site / posted code (wrap inside [code] tags)
nycguurl
10-14-2007, 08:04 PM
I don't know how, but it somehow all worked out. I think I did something like hit "Enter" a few times to get the rest of my content to clear the floaties. LoL! :p
Thanks so much for all your help!
Powered by vBulletin® Version 4.2.2 Copyright © 2021 vBulletin Solutions, Inc. All rights reserved.