Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 2 of 2
  1. #1
    New to the CF scene
    Join Date
    Jan 2005
    Posts
    4
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Dissorted div with float

    Hi all,

    I'm struggling to get a dynamic view of some images on my home page. I'm using the <div style="float: left;"> to fill the column with images. Two images on each column. This works quite alright apart from the first apperance of the image. This image "puts" down the second images to row 2. On the second row the third image appears as it should.

    Not the best explaination, but I hope it is a bit more clear when you see the code:

    <table width="380px" border="1">
    <tr>
    <td>
    <DIV STYLE="width:380; overflow-x:hidden">
    <table border="1" cellspacing="0" cellpadding="0">
    <div style="float: left;">
    <table width="180px">
    <tr>
    <td style="text-decoration:none" class="CrossRefAreaLeftMargin" align="center" width="66">
    <a style="text-decoration:none" class="CrossRefAreaText" href="nolink"><img border="1" width="66" height="50"></a>
    </td>
    <td style="padding-left:8px" width="104">
    <a style="text-decoration:none;" class="CrossRefAreaText" href="#">Test 1, Test 1, Test 1, Test...</a>
    </td>
    </tr>
    </table>
    </div>
    <div style="float: left;">
    <table width="180px">
    <tr>
    <td style="text-decoration:none" class="CrossRefAreaLeftMargin" align="center" width="66">
    <a style="text-decoration:none" class="CrossRefAreaText" href="nolink"><img border="1" width="66" height="50"></a>
    </td>
    <td style="padding-left:8px" width="104">
    <a style="text-decoration:none;" class="CrossRefAreaText" href="#">Test 2, Test 2, Test 2, Test...</a>
    </td>
    </tr>
    </table>
    </div>
    <div style="float: left;">
    <table width="180px">
    <tr>
    <td style="text-decoration:none" class="CrossRefAreaLeftMargin" align="center" width="66">
    <a style="text-decoration:none" class="CrossRefAreaText" href="nolink"><img border="1" width="66" height="50"></a>
    </td>
    <td style="padding-left:8px" width="104">
    <a style="text-decoration:none;" class="CrossRefAreaText" href="#">Test 3, Test 3, Test 3, Test...</a>
    </td>
    </tr>
    </table>
    </div>
    <div style="float: left;">
    <table width="180px">
    <tr>
    <td style="text-decoration:none" class="CrossRefAreaLeftMargin" align="center" width="66">
    <a style="text-decoration:none" class="CrossRefAreaText" href="nolink"><img border="1" width="66" height="50"></a>
    </td>
    <td style="padding-left:8px" width="104">
    <a style="text-decoration:none;" class="CrossRefAreaText" href="#">Test 4, Test 4, Test 4, Test...</a>
    </td>
    </tr>
    </table>
    </div>
    </table>
    </DIV>
    </td>
    </tr>
    </table>


    I think there should be something with the second table tag (if a eleminate that one, it works ok), but I can't change that (accordind to a template I use).

    I would really appreciate all comments on this, it drives med mad :=

    All the best,
    Martin

  • #2
    Supreme Master coder! _Aerospace_Eng_'s Avatar
    Join Date
    Dec 2004
    Location
    In a place far, far away...
    Posts
    19,291
    Thanks
    2
    Thanked 1,043 Times in 1,019 Posts
    Do you have a live link that we can take a look at? Its kinda hard without seeing the images, and in the future, can you put your code inside the vbcode tags


  •  

    Posting Permissions

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