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 3 of 3
  1. #1
    New Coder
    Join Date
    Sep 2012
    Posts
    47
    Thanks
    0
    Thanked 0 Times in 0 Posts

    PHP and Tables. How do I..

    Hi, I have a few problems which I'm not sure how to fix..

    1) Firstly, there's a tiny gap in between the 'border-bottom' line from one cell to the next.

    2) I need only the text to glow orange on the specific cell your mouse is on and also, show a hover message relating to the individual cell - rather than the entire row.

    3) I need the width of the table column to be just a tad bigger than the text inside it (so it's not too cramped), but, if the text is too long I want it to cut the text (to prevent extreme stretching of the table).



    STYLE:
    PHP Code:
    <style>td {
        
    width8em;
        
    line-height2em;
        
    background-color#fff;
        
    font-weightbold;
        
    border-bottom:1px solid #000;
        
    }
    tr:hover {
        
    color#FFE600;
        
    background-color#7500d4;
    }

    tr:hover td {
        
    background-colortransparent;
    }</
    style
    PHP TABLES
    PHP Code:
    <?php
        $across
    ;
        
    $down  ;
        
        echo 
    '<table>';
        for(
    $j=1$j <= $down  $j++){
            echo 
    '<tr title="You are looking at Row ' $down '" >';
            for(
    $i=1$i <= $across$i++){
                echo 
    "<td>Row $j Cell $i</td>";
            }
            echo 
    "</tr>";
        }
        echo 
    "</table>";
    ?>

    Any ideas?
    Last edited by john6; 09-29-2012 at 06:56 AM.

  • #2
    Senior Coder
    Join Date
    Feb 2011
    Location
    Your Monitor
    Posts
    4,327
    Thanks
    60
    Thanked 525 Times in 512 Posts
    Blog Entries
    4
    Quote Originally Posted by john6 View Post
    Any ideas?
    Yes. Ask in the html / javascript forums. This isn't a php issue but a html / javascript / client side / design issue.

    What you need to do is just get it working in a plain html page and THEN break it up to put in your php code.

    Your problem isn't php related but because you're using php to print parts of it out, you think it is. This is really a html / JS issue. PHP runs on the server. The effect you want to achieve runs in the users browser - client side via javascript.
    See my new CodingForums Blog: http://www.codingforums.com/blogs/tangoforce/

    Many useful explanations and tips including: Cannot modify headers - already sent, The IE if (isset($_POST['submit'])) bug explained, unexpected T_CONSTANT_ENCAPSED_STRING, debugging tips and much more!

  • #3
    Senior Coder
    Join Date
    Jan 2011
    Location
    Missouri
    Posts
    4,211
    Thanks
    23
    Thanked 605 Times in 604 Posts
    1.) There's tiny gaps in between the bottom lines from one cell to the next for every line. That's because the vertical lines intersect them and change the pixel color at the junction. We can get away from this by using the table attribute 'rules' and then set the table style to have a border-bottom.

    2.) color to change in hovered cell only = remove color from tr:hover, this leaves the row to turn purple. And add a td:hover with a color.

    The tool tip always says your looking at row 4 because you used $down to define it and $down is set to be 4. Use the $j instead.

    3.) The 'tad bigger than the text inside it' is easy to do. Remove a set width in the TD rules and add padding to give breathing room. But controlling the text limit by table rules is beyond me. It maybe possible but I don't know how. What I would do was put a limit on the text. To show that I have changed the for loop and included three $inside lines for you. play with em to see what I mean about cutting the string to a set length.

    Code:
     <?php
        $across= 5 ;
        $down  = 4 ;
    
        echo '<table rules="rows">';
        for($j=1; $j <= $down  ; $j++){
            echo '<tr title="You are looking at Row ' . $j . '" >';
            for($i=1; $i <= $across; $i++){
    			$inside = "Row $j Cell $i";
    			//$inside = "Row $j Cell $i and a lot of jubberish text";
    			//$inside = substr("Row $j Cell $i and a lot of jubberish text", 0, 12);
                $textline = "<td>$inside</td>";
    			echo $textline;
            }
            echo "</tr>";
        }
        echo "</table>";
    ?>
    <style type="text/css">
    table{
    	border-bottom: solid 1px black;
    	width: 600px;
    	overflow: hidden;
    }
    td {
        //width: 8em;
    padding: .5em;      // ADDED
        line-height: 2em;
        background-color: #fff;
        font-weight: bold;
        //border-bottom:1px solid #000;
    
    }
    tr:hover {
        //color: #FFE600;
        background-color: #7500d4;
    }
    td:hover {
        color: #FFE600;
    }
    tr:hover td {
        background-color: transparent;
    }
    </style>


  •  

    Posting Permissions

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