2014-09-05 2 views
0

Я создал таблицу для упорядочивания своих предметов на странице. Страница - это страница редактирования для свойства. я использовал Объединение столбцов, чтобы расширить строки и поместить текстовое поле в пределах строк и установить текстовое поле wdith до 100%, однако, ширина текстового поля по-прежнему только занимает пространство 1 колонки не 3 колонки, как я ожидал здесь кодcolspan завинчивание css asp.net table

<table align="left" style="width: 100%; float: left" class="FormFormatTable"> 

    <tr> 
     <td style="width: 10%; height: 60px">Alert Name</td> 
     <td colspan="3" style=" "> 
      <asp:TextBox CssClass="inputBoxes" ID="txtBox_alertName" runat="server"></asp:TextBox> 
     </td> 
    </tr> 
    <tr> 
     <td style="width: 10%; height: 60px;">Alert</td> 
     <td style="height: 60px; "> 
      <asp:DropDownList ID="ddl_AlertTime" runat="server"> 
       <asp:ListItem Value="1">After</asp:ListItem> 
       <asp:ListItem Value="0">Immediately</asp:ListItem> 
      </asp:DropDownList> 
     </td> 
     <td style="height: 60px; "> 
      <input id="demo_vertical0" type="number"/></td> 
     <td style="height: 60px"> 
      <asp:DropDownList ID="DropDownList1" runat="server"> 
       <asp:ListItem>Seconds</asp:ListItem> 
       <asp:ListItem>Minutes</asp:ListItem> 
       <asp:ListItem>Hours</asp:ListItem> 
      </asp:DropDownList> 
     </td> 
    </tr> 
    <tr> 
     <td style="width: 10%">Severity</td> 
     <td style=" height: 60px"" > 
      <asp:DropDownList ID="ddl_Severity" runat="server"> 
       <asp:ListItem Value="1">After</asp:ListItem> 
       <asp:ListItem Value="0">Immediately</asp:ListItem> 
      </asp:DropDownList> 
     </td> 
     <td style="">&nbsp;</td> 
     <td>&nbsp;</td> 
    </tr> 
    <tr style="height:60px"> 
     <td style="width: 10%">Receipients</td> 
     <td colspan="3" style=""> 
      <asp:TextBox CssClass="inputBoxes" ID="txtBox_Receipients" runat="server"></asp:TextBox> 
     </td> 
    </tr> 
    <tr style="height:60px"> 
     <td style="width: 10%">Subject Title</td> 
     <td colspan="3" style=""> 
      <asp:TextBox CssClass="inputBoxes" ID="txtBox_SubjectTitle" runat="server"></asp:TextBox> 
     </td> 
    </tr> 
    <tr style="height:60px"> 
     <td style="width: 10%">Alert Messsage</td> 
     <td colspan="3" style=""> 
      <asp:TextBox CssClass="inputBoxes" ID="txtBox_AlertMessage" runat="server"></asp:TextBox> 
     </td> 
    </tr> 
    <tr style="height:60px"> 
     <td style="width: 10%; ">Notification Window</td> 
     <td style=" "> 
      <asp:TextBox CssClass="inputBoxes" ID="txtBox_NotificationWindow" runat="server"></asp:TextBox> 
     </td> 
     <td style=" "></td> 
     <td style="height: 60px"></td> 
    </tr> 
    <tr style="height:60px"> 
     <td style="width: 10%; ">Notification Frequency</td> 
     <td style=" "> 
      <input id="demo_vertical" type="number"/> 
     </td> 
     <td style=" "></td> 
     <td style="height: 60px"></td> 
    </tr> 
    <tr style="height:60px"> 
     <td style="width: 10%">Fields to Display in Details</td> 
     <td colspan="3" style=""> 
      <asp:TextBox CssClass="inputBoxes" ID="txtBox_SubjectTitle3" runat="server"></asp:TextBox> 
     </td> 
    </tr> 
</table> 

CSS просто именно это

.inputBoxes { 
    width: 100%; 
} 

почему это?

скриншот моей страницы на моем компьютере enter image description here

+0

Пожалуйста, не могли бы вы создать скрипт JS, демонстрирующий проблему и/или сгенерированный html. –

+0

Ваш самый первый оператор 'Я создал таблицу для упорядочивания своих элементов на странице.' Уже не рекомендуется ... http://stackoverflow.com/questions/83073/why-not-use-tables-for-layout- in-html – LcSalazar

+0

странно, что он работает в JS, скриптируйте эту ссылку, когда я вставляю в прямой HTML-файл, но он не работает, когда я компилирую и запускаю. У меня есть сайт, размещенный здесь. http://testingnan.azurewebsites.net/editcontent однако, если я тестирую его в js скрипке, используя код из источника просмотра на веб-странице и добавьте css по этой ссылке. IT WORKS WHYYY ???????????? JS fiddle link http://jsfiddle.net/tw02j22t/ – nanobots

ответ

2

В HTML вы Имя оповещения, Receipients, Тема Название, оповещения Messsage, Поля для отображения в Подробности полей ввода принимают 3 колонки.

Уведомления Window принять одну столбцы, потому что вы не установили Объединение столбцов

enter image description here

вы должны добавить Colspan = "3" к вашему пДу notfication

<td colspan="3" style=" "> 
     <asp:TextBox CssClass="inputBoxes" ID="txtBox_NotificationWindow" runat="server"></asp:TextBox> 
    </td> 
+0

проблема не окно уведомления факт на моем компьютере ОЧЕНЬ имя первой строки предупреждение принимает ту же ширину, что и окно уведомления, я не знаю, почему это делает, что – nanobots

+0

окно уведомления занимает только длинный – nanobots

+0

убедитесь, что ваш браузер не cache old html, удалить историю или нажать ctrl + f5, чтобы перезагрузить страницу – Jala

0

У вас есть дополнительные цитаты в следующей строке (определение ячейки, которое содержит ваше управление ddl_Severity).

<td style=" height: 60px"" > 

Возможно, удалите эту цитату и посмотрите, исправляет ли она ее.

Смежные вопросы