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
    Jul 2007
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Vertical Align headache

    Hi there, I've tried and tried and tried again, I I have been googling and reading, and still can't find a solution.

    Here is the code:
    PHP Code:
    ."<td align='center' style='width: 180px; height: 180px; vertical-align: middle;'>
                <a href=\"{$row['img']}\" target=\"_blank\">
                <div style=\"position: relative; top: 0px; left: 0px; width: 180px; height: 180px; vertical-align: middle; background-color: #000000;\">
                    <div style=\"position: absolute; top: 50%; margin-top: -90px; width: 180px; height: 180px; z-index: 1; background-color: #000000;\">
                        <img style=\"vertical-align: middle;\" src=\"{$row['img']}\" $imgw border=\"0\"></img>
                    </div>
                    <div style=\"position: absolute; top: 0px; left: 0px; vertical-align: middle; z-index: 2;\">
                        <img src=\"http://www.dmfsniperz.com/modules/ImageGallery/images/overlay.png\" width=\"180\" height=\"180\" border=\"0\"></img>
                    </div>
                </div></a></td>" 
    {$row['img']} = the display picture i'm showing.

    Direct link: http://dmfsniperz.com/modules.php?na...y&file=Members

    What I'm trying to do is vertically align the shorter images within that 180x180 area.

    You will probably notice several attempts to get it vertically aligned, but all have failed.
    Last edited by allenk; 07-14-2007 at 05:43 PM.

  • #2
    New to the CF scene
    Join Date
    Jul 2007
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Well, I guess the key to this is just take it slow.

    heres the fix

    PHP Code:
    echo "<table width='70%' height='180' cellpadding='0' cellspacing='0' align='center'>"
                
    ."<tr>"
                
    ."<td align='center' style='width: 180px; height: 180px;' valign='middle'>"
                
    ."<a href=\"{$row['img']}\" target=\"_blank\">"
                
    ."<div style=\"position: relative; width: 180px; height: 180px; top: 0; left: 0;\">"
                
    ."<div style=\"z-index: 1; position: relative; top: 0; left: 0; width: 180px; height: 180px; display: table-cell; vertical-align: middle; background-color: #000000;\"><img src=\"{$row['img']}\" $imgw border=\"0\"></img></div>"
                
    ."<div style=\"z-index: 2; position: absolute; top: 0; left: 0; width: 180px; height: 180px;\"><img src=\"http://www.dmfsniperz.com/modules/ImageGallery/images/overlay.png\" width=\"180\" height=\"180\" border=\"0\"></img></div>"
                
    ."</div></a></td>" 


  •  

    Posting Permissions

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