SitePoint Sponsor

User Tag List

Page 2 of 2 FirstFirst 12
Results 26 to 41 of 41
  1. #26
    om nom nom nom Stomme poes's Avatar
    Join Date
    Aug 2007
    Location
    Netherlands
    Posts
    10,273
    Mentioned
    50 Post(s)
    Tagged
    2 Thread(s)
    iirc, IE7 was specifically the one who needed some space for the scrollbar... I remember trying without it and the other browsers seemed mostly ok, but IE7 would cut off the last column.

  2. #27
    SitePoint Wizard nofel's Avatar
    Join Date
    Aug 2007
    Location
    Earth
    Posts
    1,766
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    i found a solution. i modified what paul posted. here is my code
    Code HTML4Strict:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>Untitled Document</title>
    <style>
    #wrapper{width:500px; height:200px; border:1px solid red; overflow:hidden; position:relative}
    .inner{width:500px; height:200px; overflow:auto;}
    th thead tfoot{position:fixed;}
    </style>
    </head>
     
    <body>
    <div id="wrapper">
    <table border="1">
        <tr>
            <thead>
                <th width="200">Name</th>
                <th width="100">Address</th>
                <th class="last" width="200">Modify</th>
             </thead>
         </tr>
    </table>
    <div class="inner">
            <table>
                 <tr>
                     <tbody>
                        <td class="last" width="200" valign="top"><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse ultricies suscipit nisl nec tristique. Praesent enim lorem, vestibulum eleifend sollicitudin a, pulvinar eu sem. Etiam pharetra vulputate elit, et imperdiet tellus dapibus et. Vestibulum odio quam, ultrices a scelerisque quis, placerat nec arcu. Sed tempus nisl magna. Morbi mauris augue, lacinia a feugiat in, porta quis purus. Nullam ligula dui, ullamcorper vit</p></td>
                        <td class="last" width="100" valign="top"><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse ultricies suscipit nisl nec tristique. Praesent enim lorem, vestibulum</p></td>
                        <td class="last" width="200" valign="top"><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse ultricies suscipit nisl nec tristique. Praesent enim lorem, vestibulum eleifend sollicitudin a, pulvinar eu sem. Etiam pharetra vulputate elit, et imperdiet tellus dapibus et. Vestibulum odio quam, ultrices a scelerisque quis, placerat nec arcu. Sed tempus nisl magna. Morbi mauris augue, lacinia a feugiat in, porta quis purus. Nullam ligula dui, ullamcorper vit</p></td>
                     </tbody>
         </tr>
         </table>
    </div>
    </div>
            <table>
                <tfoot>
                    <tr>
                    <td width="200">Hello</td>
                    <td width="100">World</td>
                    <td width="200">Hello</td>
                    </tr>
                </tfoot>
             </table>
     
    </body>
    </html>
    All those who wander aren't lost.

  3. #28
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    40,298
    Mentioned
    179 Post(s)
    Tagged
    6 Thread(s)
    Quote Originally Posted by ammark View Post
    i found a solution. i modified what paul posted. here is my code
    You haven't listened to a word we said have you

    All you have done there is to create three tables and fixed the widths. There is no correlation between the header and footers and it will only work as long as the data is fixed to those specific widths.

    The position:fixed you are using is having no effect as you can't position part of a table.

    However if that's all you wanted then it will work.

    There never was any problem in doing it in three tables but it makes nonsense of the semantics and doesn't allow all the data to stretch accordingly.

    Ryan gave you a 3 column version above with visible footer anyway.

  4. #29
    SitePoint Wizard nofel's Avatar
    Join Date
    Aug 2007
    Location
    Earth
    Posts
    1,766
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    i m sorry if i ignored what u said in posts. actually i m out of time as i have presntation tomorrow and so much to do but there is another problem now when i insert php tags which is calling dynamic data from database in td of tbody. each td get height of 200 which comes from inner class still problem
    All those who wander aren't lost.

  5. #30
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    40,298
    Mentioned
    179 Post(s)
    Tagged
    6 Thread(s)
    Quote Originally Posted by ammark View Post
    i m sorry if i ignored what u said in posts.
    It's ok we are used to it

    actually i m out of time as i have presntation tomorrow and so much to do but there is another problem now when i insert php tags which is calling dynamic data from database in td of tbody. each td get height of 200 which comes from inner class still problem
    Remove the height from the wrapper as its not needed and is cutting the table short.

    Code:
    #wrapper{width:500px; border:1px solid red; overflow:hidden; position:relative}

  6. #31
    SitePoint Wizard nofel's Avatar
    Join Date
    Aug 2007
    Location
    Earth
    Posts
    1,766
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by Paul O'B View Post
    It's ok we are used to it

    Remove the height from the wrapper as its not needed and is cutting the table short.

    Code:
    #wrapper{width:500px; border:1px solid red; overflow:hidden; position:relative}
    did that nothing happened. the gap r still huge between td
    All those who wander aren't lost.

  7. #32
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    40,298
    Mentioned
    179 Post(s)
    Tagged
    6 Thread(s)
    Do you have a revised example that I can look at as I'm not quite sure what I'm looking for?

  8. #33
    SitePoint Wizard nofel's Avatar
    Join Date
    Aug 2007
    Location
    Earth
    Posts
    1,766
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by Paul O'B View Post
    Do you have a revised example that I can look at as I'm not quite sure what I'm looking for?
    what i am looking for
    1.headers to be fixed. that i did.
    2. tbody to be scrollable (that also i did but it has huge gaps in b.w i think its taking it from inner class)
    3.tfooter shld be fixed too as i m gonna show buttons. here is the example (bare with me the php)
    having said that i tried same thing on with just dummy text and it worked fine but the programmer modified what i made before as in many pages its working fine but i can't go and delete the php code in every page to make his html correct so i need made a new one. here is the updated code
    Code HTML4Strict:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>Untitled Document</title>
    <script language="javascript" type="text/javascript" src="../js/formValidations.js">
    </script>
    <script type="text/javascript" language="javascript">
    function update(count){
        //alert(count);
        //var rstatus = document.getElementsByName('rstatus[]');
        //var check = rstatus[count].checked;
        //if(check == 1){
        //    check = 1;
        //}else{
        //    check = 0;
        //}
        document.getElementById('hcount').value = count;
        //document.getElementById('hidStatus').value=check;
        document.roleFrm.submit();
    }
    </script>
    <style>
    #wrapper{width:100%; border:1px solid red; overflow:hidden; position:relative}
    .inner{width:500px; height:200px; overflow:auto;}
    th thead tfoot{position:fixed;}
    td tbody{margin:0px;}
    </style>
    </head>
     
    <body onload="<?php if($error){?>return chkRole(1);<?php }?>">
     
    <div class="popup" style="height:250px;  width:400px;">
    <form name="roleFrm" method="post" action="pm_role.php" onsubmit="return chkRole(this);">
    <input type="hidden" name="hcount" id="hcount">
    <div id="wrapper">
    <table border="1">
        <tr>
            <thead>
                <th width="200">Name</th>
                <th width="100">Status</th>
                <th class="last" width="200">Action</th>
             </thead>
         </tr>
    </table>
    <?php 
    $query = "SELECT name,status,role_id FROM pm_roles ORDER BY name";
    $stmt = doParse($conn, $query);
    $result = doExecute($stmt);
    $count = 0;
    while(ocifetchinto($stmt, $values)){
    ?>
    <div class="inner">
            <table>
                 <tr>
                     <tbody>
                        <td  width="200" valign="top"><input type="text" name="role[]" size="30" value="<?php echo $values[0];?>" <?php if($edit && $rid==$values[2]){ }else{?> readonly="readonly"<?php }?>/></td>
                        <td  width="100" valign="top"><input type="checkbox" name="rstatus[]" <?php if($values[1]=='Active'){?> checked="checked" <?php } if($edit && $rid==$values[2]){ }else{?> disabled="disabled"<?php }?>/></td>
     
                        <td width="200" valign="top"><?php if($edit && $rid==$values[2]){?><a href="#" onclick="update(<?php echo $count?>);">save</a><?php }else{?><a href="pm_role.php?rid=<?php echo $values[2];?>&edit=1">edit</a><?php }?></td>
                     </tbody>
         </tr>
         <?php 
    $count++;
    }
    ?>
         </table>
    </div>
    </div>
            <table>
                <tfoot>
                    <tr>
                    <td><input type="text" name="txtNewRole" id="txtNewRole" size="30" style="background:#FFFF99" /></td>
                    <td width="200"><input class="buttons" type="submit" name="add" value="Add" style="width:75px;"></td>
                    <td width="100"><input type="button" class="buttons" name="close" value="Close" onclick="javascript:window.close();"/></td>
                    <td width="200">Hello</td>
                    </tr>
                </tfoot>
             </table>
     
    </body>
    </html>
    above the doctype is the php connection and includes file (which i excluded)
    All those who wander aren't lost.

  9. #34
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    40,298
    Mentioned
    179 Post(s)
    Tagged
    6 Thread(s)
    tbody to be scrollable (that also i did but it has huge gaps in b.w i think its taking it from inner class)
    I'm not seeing any large heights on the td content. Is this only happening in a certain browser or is there some other code that we need?

    We would prefer to see actual code from view source (without php) so we can test locally. You need ot create a workking eaxample for us exhibiting the problem as only then can we really address the issue.

    I do notice that your table structure is all wrong and you have the tbody tags in the wrong place. They should be outside the tr not inside it.

  10. #35
    SitePoint Wizard nofel's Avatar
    Join Date
    Aug 2007
    Location
    Earth
    Posts
    1,766
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by Paul O'B View Post
    I do notice that your table structure is all wrong and you have the tbody tags in the wrong place. They should be outside the tr not inside it.
    could this be the issue. i posted all code. there r no gaps with the static text but with dynamic data the gap is huge. (in all browsers)
    Edit:i did fixed the tr but still gaps r there, i used firebug to find whats wrong. i found that in while loop. the inner div is repeating thus giving every td height of 200. so i found the problem how do i fix it?
    Last edited by nofel; Feb 12, 2010 at 05:55. Reason: found problem reason
    All those who wander aren't lost.

  11. #36
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    40,298
    Mentioned
    179 Post(s)
    Tagged
    6 Thread(s)
    If the .inner div is repeating then it sounds like your programmer has repeated the div and the table instead of repeating the tr elements only. That would be a programming fix not a css one.

    As I said above if you posted the css from the browsers view source as requested we could have seen the extra tags and structure that was actually being output.

  12. #37
    SitePoint Wizard nofel's Avatar
    Join Date
    Aug 2007
    Location
    Earth
    Posts
    1,766
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    it might be coz i m placing the while loop inside inner div? which is performing whole table thingy again.?
    All those who wander aren't lost.

  13. #38
    om nom nom nom Stomme poes's Avatar
    Join Date
    Aug 2007
    Location
    Netherlands
    Posts
    10,273
    Mentioned
    50 Post(s)
    Tagged
    2 Thread(s)
    You know, this might start getting into PHP, and it's possible that this thread might need to be referenced in a new thread over there?

    This while loop must be in PHP right? Since HTML and CSS can't do that.

  14. #39
    SitePoint Wizard nofel's Avatar
    Join Date
    Aug 2007
    Location
    Earth
    Posts
    1,766
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    Ah! so a programmer mate fixed the issue. i was making a table after while loop which made it whole repeat and it gave problem coz whole table structure was epeated whereas the tr shld have been repeated. but thnx though all of u.
    Cheers,
    All those who wander aren't lost.

  15. #40
    om nom nom nom Stomme poes's Avatar
    Join Date
    Aug 2007
    Location
    Netherlands
    Posts
    10,273
    Mentioned
    50 Post(s)
    Tagged
    2 Thread(s)
    Yay! Glad this got working for you! Your presentation is tomorrow? Good luck with it.

  16. #41
    SitePoint Wizard nofel's Avatar
    Join Date
    Aug 2007
    Location
    Earth
    Posts
    1,766
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    thnx stomme. yea its a international presentation. so i will bothering u guys more if i run into any more problems. hehehe :P
    All those who wander aren't lost.


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
  •