Results 1 to 8 of 8

Thread: Totally new question about tables

  1. #1
    Join Date
    May 2007
    Posts
    99
    Thanks
    15
    Thanked 0 Times in 0 Posts

    Question Totally new question about tables

    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.

    Is this a CSS question? Goodness, I hope so. I don't wanna get in trouble or anything.

  2. #2
    Join Date
    Jul 2006
    Location
    just north of Boston, MA
    Posts
    1,806
    Thanks
    13
    Thanked 72 Times in 72 Posts

    Default

    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.
    Code:
    <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
    Code:
    <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>

  3. #3
    Join Date
    May 2007
    Posts
    99
    Thanks
    15
    Thanked 0 Times in 0 Posts

    Default

    Ok, I like code #2. (Figures I would, LoL.)
    I'll try that one first. Thanks!!!

  4. #4
    Join Date
    May 2007
    Posts
    99
    Thanks
    15
    Thanked 0 Times in 0 Posts

    Default

    Ok, I implemented code #2 and it's gorgeous but something happened!

    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?

  5. #5
    Join Date
    Jul 2006
    Location
    just north of Boston, MA
    Posts
    1,806
    Thanks
    13
    Thanked 72 Times in 72 Posts

    Default

    dont position it with absolutes. take away the margins and padding

    Code:
    <table style="float:left;margin:0;padding:0">
    ...
    </table>
    <img src="url" style="float:left;margin:0;padding:0">
    ...

  6. #6
    Join Date
    May 2007
    Posts
    99
    Thanks
    15
    Thanked 0 Times in 0 Posts

    Default

    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.
    Last edited by nycguurl; 10-11-2007 at 09:38 PM.

  7. #7
    Join Date
    Jul 2006
    Location
    just north of Boston, MA
    Posts
    1,806
    Thanks
    13
    Thanked 72 Times in 72 Posts

    Default

    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)

  8. #8
    Join Date
    May 2007
    Posts
    99
    Thanks
    15
    Thanked 0 Times in 0 Posts

    Default

    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!

    Thanks so much for all your help!

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •