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
    May 2010
    Posts
    23
    Thanks
    9
    Thanked 0 Times in 0 Posts

    CSS Dynamic(?) Height

    So I have a PHP page that displays from 1 to 4 input fields. Depending on the circumstance, I want the height of the content box to only be as large as the number of input fields. This might be slightly beyond CSS-only coding, but I do not know where to start.

    The PHP looks something like this:
    Code:
    <div id="content">
    <form>
    <ul>
    //if the name of field is in the array $arr
    			if(in_array("fname",$arr)){
    //display the input field
    			
    echo '<li>First Name:<input type="text" class="text" value="" name="First Name" /> </li>';}
    if(in_array("lname",$arr)){
    echo '<li>Last Name:<input type="text" class="text" value="" name="Last Name"/> </li>';}
    if(in_array("address",$arr)){
    echo '<li>Address:<input type="text" class="text" value="" name="Address"/> </li>';}
    if(in_array("email",$arr)){
    echo '<li>Email:<input type="text" class="text" value="" name="Email" /> </li>';}
    </ul> <input id="submit_button" class="button" type="submit" name="subscribe" value="Subscribe" /> </form> </div>
    Basically, if you ignore the PHP, its an ul that depending on the user, will include 1 to 4 text input fields. Is there any way to set the CSS for #content to change depending on that user.

  • #2
    Senior Coder tomws's Avatar
    Join Date
    Nov 2007
    Location
    Arkansas
    Posts
    2,644
    Thanks
    29
    Thanked 330 Times in 326 Posts
    Don't apply a height. The content div will automatically wrap the contained elements.
    Are you a Help Vampire?

  • #3
    New to the CF scene
    Join Date
    Dec 2009
    Posts
    5
    Thanks
    0
    Thanked 0 Times in 0 Posts
    don't apply height to div... If you have to apply height to a div for specific reason specify height as follows:

    min-height:200px; /*this height will be stretched down in all browsers except IE6*/
    _height:200px; /*this height will work for IE* and can be stretched down (this is fix for IE6)*/

    min-height dont wrk in IE6, so its good to apply 'height' attribute for IE6.


  •  

    Posting Permissions

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