Как изменить размеры div во время выполнения на основе размера его элемента управления
У меня есть div и gridview на моей странице, как показано ниже:
<div id="gdDiv" style="overflow:scroll; height:500px; width:1270px; background-color:Black;" onload="MakeEqualDimension()"> <asp:GridView ID="gdView" runat="server" Width="1200px" Height="350px" RowStyle-HorizontalAlign="Center" RowStyle-VerticalAlign="Middle" HeaderStyle-HorizontalAlign="Center" HeaderStyle-BackColor="Maroon" HeaderStyle-ForeColor="White" HeaderStyle-Height="5px" RowStyle-BackColor="Black" RowStyle-ForeColor="White" GridLines="Both" ShowFooter="true" RowStyle-Wrap="false" onrowcreated="gdView_RowCreated" onrowdatabound="gdView_RowDataBound" HeaderStyle-Font-Size="10px" RowStyle-Font-Size="10px" HeaderStyle-Font-Bold="true" FooterStyle-Font-Bold="true" FooterStyle-Font-Size="10px"> </asp:GridView> </div>
Gridview заполняется динамически, поэтому его высота и ширина варьируются в зависимости от количества данных. Я хочу, чтобы div также изменял свою высоту и ширину в зависимости от высоты и ширины gridview после его заполнения.
Что я уже пробовал:
Поэтому я попробовал следующий javascript на стороне клиента.
<script type="text/javascript"> function MakeEqualDimension() { if ((document.getElementById('gdDiv').offsetHeight) > (document.getElementById('gdView').getAttribute("height"))) { document.getElementById('gdDiv').style.height = (document.getElementById('gdView').getAttribute("height")) + "px"; } if ((document.getElementById('gdDiv').style.width) > (document.getElementById('gdView').getAttribute("width"))) { document.getElementById('gdDiv').width = (document.getElementById('gdView').getAttribute("width")) + "px"; } } </script>
Но это не работает. Пожалуйста, помогите мне. Спасибо.
ZurdoDev
Вы пробовали установить высоту вашего div на 100%?
Richard Deeming
Просто уберите overflow
, height
и width
стили. До тех пор, пока вы не используете float
или абсолютное позиционирование на сетке, div автоматически расширится, чтобы быть по крайней мере таким же большим, как и его содержимое.
L B Choudhury
Стили height &width задаются для установки максимальных значений для div. И в тех случаях, когда высота или ширина gridview становится больше, чем максимальные значения div, то переполнение:прокрутка должна войти в изображение.
Richard Deeming
Так в чем же тогда проблема? Либо вы хотите, чтобы div расширялся, чтобы соответствовать сетке, либо нет.