Вопросы Теги

Фрагмент DIV к высоте 100% в ячейке таблицы

Моя проблема была решена путем изменения кода ниже 

<?php

echo share('test.rar');

function share($sFile)
{   
$cfile = new CURLFile($sFile,'file/rar','sample_name');
$request = curl_init('https://file.io/?expires=1m');
curl_setopt($request, CURLOPT_POST, true);
curl_setopt(
    $request,
    CURLOPT_POSTFIELDS,
    array(
      'file' => $cfile
    ));

curl_setopt($request, CURLOPT_RETURNTRANSFER, true);
Return curl_exec($request);
curl_close($request);
}
?>
18
задан Siva Charan 3 November 2011 в 13:04
поделиться

4 ответа

Наблюдение, поскольку у Вас уже есть таблицы для расположения, я действительно не потрудился бы пытаться сделать это "право" путь.

Просто использование другая таблица.
HTML 

<table id="content" width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
    <td><img src="corner1.jpg"/></td>
    <td>&nbsp;</td>
    <td><img src="corner2.jpg"/></td>
</tr>
<tr>
    <td>&nbsp;</td>
    <td valign="top" style="padding:0px;">
        <table id="container" border="0" cellspacing="0" cellpadding="0">

            <tr>
                <td id="menu"><div>Menu</div></td>
                <td style="width:10px"></td>
                <td id="mainContent"><div>Main Content</div></td>

            </tr>
        </table>
    </td>
    <td>&nbsp;</td>
</tr>
<tr>
    <td><img src="corner3.jpg"/></td>
    <td>&nbsp;</td>
    <td><img src="corner4.jpg"/></td>
</tr>
</table>
CSS 

    <style type="text/css" media="screen">
        #menu {
            width:235px;
            height:445px;
            background-color:#660000

        }
        #mainContent {

            height:100%;
            width:auto;
            background-color:#888888
        }
        #container {
            width:100%;
        }
    </style>

4
ответ дан 30 November 2019 в 09:40
поделиться

возможно, можно добавить, что минимальная высота правильному отделению равняется значению высоты левых один... это могло, возможно, добиться цели, к какому Вы хотите...

1
ответ дан 30 November 2019 в 09:40
поделиться

Вы могли установить позицию отделения для абсолюта, но тогда конечно, необходимо будет расположить его абсолютно.

0
ответ дан 30 November 2019 в 09:40
поделиться

Я использовал jQuery и анимационный вызов для установки высот отделений, но можно установить анимационную скорость на 0.

пример ревет, был для некоторых макетов для того, чтобы быстро играть вокруг с 2,3,5... блочными конструкциями. Анимационный вызов JQuery используется для калибровки высоты отделений для основного содержания, боковая панель и т.д.... но это может быть немного чрезмерно для требования. 

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Mock_2_ColGoldenRatio.aspx.cs" Inherits="ia._HtmlMocks.Mock_2_ColGoldenRatio" %>

<!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 runat="server">
    <title></title>

    <style type="text/css" >


/*normalise*/
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
margin:0;
padding:0;
font-size:100%;
font-style:normal ;
font-weight:normal;
border-collapse:collapse ;
border-spacing:0;
border:0;
border-width: 0px ;
text-align:left;
}
q:before,q:after
{
    content:'';
}

/*center everything using html container*/
html{
text-align: center ; 
}

/* wash with olive ; make body width max 976 px ; no margin ; relative position so other elements within */
body
{
background-color:Olive; 
width:976px; 
margin:0 auto ; 
text-align: left ; 
position: relative  ;
}

#HeaderEnc
{
background-color : Maroon ; 
}

#SearchEnc{
background-color: red ;
border-width: 0px ;
}

#MainBlogNav{
background-color:Yellow  ;
}

/* postion relative to normal flow */
#ContentEnc{
background-color: Teal  ;  
position: relative  ;
}



    #ContentSideBarA
    {
    position: absolute ; 
    background-color: #AAA ; 
    left: 62% ; 
    width: 38% ; 
    }

    #ContentMainEnc{
    position: absolute ; 
    background-color: #888; 
    left: 0% ; 
    width: 62% ; 
    }

    #ContentSideBarB{
    position:absolute ; 
    background-color : #AAA ; 
    left: 0% ; 
    width: 0px ; 
    }

    #FooterEnc{
    position: absolute ; 
    background-color: blue ; 
    left: 0 ; 
    width: 100% ; 
    }
</style>
</head>
<body>
    <div id="HeaderEnc">
    The quick brown fo jumped over the lazy dog. 
    <br />
    HeaderEnc
        <div id="SearchEnc">SearchEnc</div>        
        <div id="MainBlogNav">MainBlogNav</div>        
    </div> 

    <div id="ContentEnc">
        <div id="ContentMainEnc"><i>ContentMainEnc</i> : 
            <% Response.Write( GetContentBig()) ; %>
        </div> 

        <div id="ContentSideBarA"><i>ContentSideBarA</i> 
            <% Response.Write( GetContentSmall()) ; %>
        </div> 

        <div id="ContentSideBarB"><i>ContentSideBarB</i>
            <% /*Response.Write( GetContentMedium()) ;*/ %>
        </div>

        <i>ContentEnc-Start</i>
        <br />
        <br />
        <br />
        <br />
        <i>ContentEnc-Start</i>
    </div>
    <div id="FooterEnc" >FooterEnc</div> 

</body>
</html>


<script src="../../Scripts/jquery-1.3/jquery-1.3.1.js" type="text/javascript"></script>
<script  src="../../Scripts/plugins/dimensions_1.2/jquery.dimensions.js" type="text/javascript" ></script>
<!--<script  src="../../Scripts/Common/IaCommon.js" type="text/javascript" ></script>-->

<script  type="text/javascript" >

    /*
    * ia.common 0.1.0 
    *
    */

    var ia = {}
    ia: "0.1.0";

    // gets max settings from set of elements
    var getBoundaries = function(elements) {
        var maxHeight = 0;
        var maxTop = 0;
        var itemSelector = '';
        var itemHeight = 0;
        var itemPosition = {};
        var itemTop = 0;

        for (i = 0; i < elements.length; i++) {
            itemSelector = elements[i]
            itemHeight = $(itemSelector).height();
            itemPosition = $(itemSelector).position();
            itemTop = itemPosition.top;
            maxHeight = itemHeight > maxHeight ? itemHeight : maxHeight;
            maxTop = itemTop > maxTop ? itemTop : maxTop;
        }
        return { 'maxHeight': maxHeight, 'maxTop': maxTop };
    }

    // Rets truthy  ; used by property get/set public fns
    var SetIfOk = function(val) { return val; }

    // IaPage class
    var IaPage = function(objSpec) {
        // override default page object with defaults from caller
        var that = $.extend({
            'speedFooterAnimate': 3000
            , 'speedContentAnimate': 1000
        }, objSpec || {});

        // fn to move footer, ... to correct position : inmann clearing
        that.arrangePageStructure = function() {
            boundaries = getBoundaries(this.ContentElements);
            $(this.FooterEncSelector[0]).animate({ 'top': boundaries.maxTop + boundaries.maxHeight }, this.speedContentAnimate);
            $(this.ContentEncSelector[0]).animate({ 'height': boundaries.maxHeight }, this.speedFooterAnimate);
        };
        // Ret
        return that;
    }


    var iaPage = IaPage(
    {
        'ContentEncSelector': ['#ContentEnc']
        , 'FooterEncSelector': ['#FooterEnc']
        , 'ContentElements': ['#ContentEnc', '#ContentSideBarA', '#ContentMainEnc', '#ContentSideBarB']
    }
    );

    $(function() {
        iaPage.arrangePageStructure();
    }
    );

</script>
0
ответ дан 30 November 2019 в 09:40
поделиться