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 5 of 5

Thread: Layout Problem

  1. #1
    Regular Coder
    Join Date
    May 2010
    Posts
    208
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Layout Problem

    In this layout, when I click the magnifier button, and it display the data, I want the height of white color (center container) to adjust.




    The problem is when data are displayed the white color does not adjust.



    The white container has a height specified here which is 850px;. Is there a solution to this?

  • #2
    Senior Coder effpeetee's Avatar
    Join Date
    Feb 2007
    Location
    Clapham Junction - London SW
    Posts
    4,885
    Thanks
    228
    Thanked 204 Times in 203 Posts
    We really need to see your code, or better still a link.

    My Sources program may help you.

    EQUAL HEIGHT or FAUX COLUMNS.

    Frank
    Last edited by effpeetee; 06-17-2010 at 10:45 AM.
    * Sources (updated: 21.11.2012.
    Using Windows 8 Professional. 64bit with HP Photosmart 5510 printer Very useful site here.

  • #3
    New Coder
    Join Date
    Jan 2010
    Location
    UT
    Posts
    35
    Thanks
    1
    Thanked 3 Times in 3 Posts
    If your layout is done in tables, add in valign="top" attribute into your <td> tags. This will vertically align text to the top of the table cell.
    Just here to help.

  • #4
    Regular Coder
    Join Date
    May 2010
    Posts
    208
    Thanks
    0
    Thanked 0 Times in 0 Posts
    css code
    Code:
    @charset "utf-8";
    /* CSS Document */
    
    #wrapper{
    width:1100px;
    margin: 0 auto;
    
    
    
    text-align:left;
    background-color:#FFF;
    height:609px;
    
    
    }
    
    
    
    	html,body {
    background:url(images/backgroundimage.jpg); 
       margin:0;
       padding:0;
     
    	font-family:Trebuchet MS,Arial;
    
    
    
     
    }
    
    	
    	
    ul li{
      list-style-type:none;
      text-align:center;
    }
    
    
    
    ul{
    list-style-type:none;
    
    clear:both;
    
    }
    li{
    display:inline;
    }
    a{
    float:left;
    
    text-decoration:none;
    color:white;
    font-weight:bold;
    background:#2eafa4;
    
    font-family:Trebuchet MS,Arial;
    width:86px;
    height:22px;
    font-size:12pt;
    margin-left:5px;
    text-align:center;
    
    
    }
    a:hover{
    background:#ed1a3b;
    }
    
    
    .button {
        border: none;
        width: 86px;
        height: 22px;
        background: url(images/submitrollover.gif) no-repeat top left;
    }
    
    .button:hover {
       background-position: -90px 0


    PHP Code:

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    <title>Search Contacts</title>

    <link rel="stylesheet" type="text/css" href="layout.css" title="" />
    <style type="text/css" media="screen">

    ul  {
         list-style-type:none;
      position:relative;
      top:5px;
        
        
    }



    body 
    {
        
        color: #ed1a3b;
        font-family:Trebuchet MS,Arial;
        
    }




    h3

    {
        
    color: #ed1a3b;

    font-size:24pt




    }

    p {
        color: #ed1a3b;
        font-size:12pt;
        
    }

    .box
    {
        
        margin-left:55px;

        float:left;
        font-size:18pt;
        color:#ed1a3b;
        font-family:Trebuchet MS,Arial;
        font-weight:bold;
        margin-top:9px;


    }
        
        .box2
        {
            margin-left:
            
        }
        
        .container 
        
        {
            float:left;
            margin-top:15px;
            
            
            
        }
        
        
        

    .searchbox
    {
        float:right;
        margin-top:-490px;
        margin-right:15px;
        
        
    }

    .boxposition
    {
        position:relative;
        left:15px;
        
    }

    .header

    {
        float:left;
        height:60px;
        margin-top:15px;
        
        
    }

    </style>
    </head>


    <body>


    <div id="wrapper">
    <div class="header">
    <img src="images/BDOlogo.gif" alt="" align=""  style="float:left;   margin-left:15px"> 

    <div class="box"> INTRANET   </div>
    </div>
    <ul >
    <li><a href="search_display3.php"> Home</a></li>
    <li><a href="new.php"> New </a> </li>
    </ul><br> 




    <br> <br>



    <?php


    if(isset($_POST['submit_x'])){
    if(isset(
    $_GET['go'])){
    if(
    preg_match("/[A-Z | a-z]+/"$_POST['name'])){

    $pangalan $_POST['name']; 

    //connect to the database
    $db=mysql_connect ("localhost""root") or die ('I cannot connect to the database because: ' mysql_error()); 

    //-select the database to use
    $mydb=mysql_select_db("records2");

    //-query the database table
    //$sql="SELECT id, fname, lname FROM table1 WHERE fname LIKE '%" . $name . "%' OR lname LIKE '%" . $name ."%'";

    //$sql="SELECT *FROM table1  WHERE fname LIKE '%" . $pangalan . "%' OR lname LIKE '%" . $pangalan ."%' UNION SELECT *FROM table2  WHERE fname LIKE '%" . $pangalan . "%' OR lname LIKE '%" . $pangalan ."%' ";
    $sql="SELECT *FROM table1  WHERE fname LIKE '%" $pangalan "%' OR lname LIKE '%" $pangalan ."%' ";


    $result=mysql_query($sql);
    while(
    $row=mysql_fetch_array($result)){
        

         
    $FirstName =$row['fname'];
        
    $LastName=$row['lname'];
        
    $PhoneNumber=$row['phone'];
        
    $Email=$row['email'];
        
    $position=$row['position'];
        
    $image=$row['imagepath'];
        
    $doc=$row['docpath'];
            
    //-display the result of the array

    ?>

    <br> <br> 

    <div class="container" >
    <table style='color: #ffffff; font-size:19px; position:relative; left:15px;'  bgcolor='#62cae3'  cellspacing='2' cellpadding='3'  > 
    <tr> <td colspan='7' style='color: #FFF; font-size:18pt;   ' > 

     <strong> PERSONAL INFORMATION </strong> 
    </td> 

    <tr> </tr>  <tr> </tr> <tr> </tr>  <tr> </tr> <tr> </tr> 
    </tr> 
         <tr> <td rowspan='3'> <?php echo " <img src =\"" $row['imagepath']."\" width='110'> " ?></td>
        <td>Last Name</td> 
       <td>:</td> 
       <td><input name='lname' type='text' id='name' size='20' value="<?php echo $LastName?>"></td> 
       
         <td>Middle name</td>
        <td>:</td> 
        <td colspan='4'><input name='mname' type='text' id='name' size='20' value='Torres'></td>
      </tr>
      <tr>
       <td>First Name</td>
        <td>:</td>
        <td><input name='fname' type='text' id='name' size='20' value="<?php echo $FirstName?>"></td>
        <td>Age</td>
        <td>:</td>
        <td><input name='age' type='text' id='name' size='3' value='25'></td>
        
          <td>Sex</td>
        <td>:</td>
        <td><input name='sex' type='text' id='name' size='3' value='M'></td>
        </tr>
        <tr>
            <td>Position</td>
        <td>:</td>
        <td><input name='position' type='text' id='name' size='20' value="<?php echo $position?>"></td>
         <td>Group</td>
        <td>:</td> 
        <td colspan='3'><input name='group' type='text' id='name' size='20' value='ARMCI'></td>
        </tr> 
        <tr> <tr> <tr> 
        
      
      
    <?php

    //echo "<ul>\n"; 
    //echo "<li>Name: &nbsp;" . $FirstName . " " . $LastName . "</li>\n";
    //echo "<li>Phone Number: &nbsp; " . $PhoneNumber . "</li>\n";
    //echo "<li>" . "<a href=mailto:" . $Email . ">" . $Email . "</a></li>\n";
    //echo "</ul>";

    //echo "<tr>"; 
    //echo "<td><img src =\"" . $row['imagepath']."\"></td>";  
    //echo "</tr>"; 
     

     
     
    echo "</tr>"
    echo 
    " </div> ";
     echo 
    "</table>" ;
     
    ?>
     
     <br> 
     <div class="boxposition">
    <?php
     
    echo '<a href="edit(for_search).php?id=' $row['id'] . '">Edit</a>';
    ?>
    </div>

    <?php
     
    echo "  <a href='$doc' style='position:relative; left:15px;'>Resume</a> ";
     echo 
    "</div> ";
     
    }
    }
    else{
    echo 
    "";
    }
    }
    }
    ?>

    <div class="searchbox">
    &nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp; 
    <img src="images/locatorTop.gif"  >
    <p style="font-size:18px">Search Employee Details <p>
    <p style="font-size:12pt; color:#685040">You may search either by first or last name</p>
    <form method="post" action="search_display3.php?go" id="searchform">


    <input type="text" name="name"  style="float:left;" >

    <input type="image" value="Submit" class="search_button" src="images/magnifying.gif" name="submit" >



    <!--<input type="submit" name="submit" value="Submit"> -->
    </form>
    <br>
    &nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp; <img src="images/locatorBottom.gif">

    </div>
    </div>
    </body>
    </html>
    I know the codes are a bit messy( I am not an expert, and I lack time), in which there are uncessesary codes. There intranet have a specific width and height

  • #5
    Regular Coder
    Join Date
    May 2010
    Posts
    208
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by Zoic View Post
    If your layout is done in tables, add in valign="top" attribute into your <td> tags. This will vertically align text to the top of the table cell.
    Thanks for the input, but my problem is how to let the height adjust to the contents.? Height:auto does not work here.


  •  

    Posting Permissions

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