Изменить высоту строки-высоты, для текста, который занимает несколько строк - PullRequest
Новая
       35

Изменить высоту строки-высоты, для текста, который занимает несколько строк

0 голосов
/ 10 ноября 2019

У меня есть JQGrid со столбцом, содержащим текст различной длины.

Некоторые ячейки превышают одну строку, и я настроил их в CSS, чтобы текст можно было переносить, чтобы он отображался на несколькихстроки.

Моя проблема заключается в том, что мне нужно, чтобы все строки имели одинаковую высоту, поэтому, например, если одна строка равна 21px, я хочу, чтобы ячейка с двумя строками текста имела высоту 42px.

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

Есть ли способ изменить интервал между строками, только на ячейках, которыеотображаются в виде нескольких строк?

Вот код, который я использую для добавления JQGrid. 

            <trirand:JQGrid runat="server" ID="JQGrid1" DataSourceID="SqlDataSource1" OnRowSelecting="JQGrid1_RowSelecting" Responsive="false" Width="1170px" Height="100%">
            <ClientSideEvents AfterDeleteDialogRowDeleted="afterDel"  AfterAddDialogRowInserted="afterInsert" BeforeAddDialogShown="beforeAdd" BeforeDeleteDialogShown="beforeDel" BeforeEditDialogShown="beforeEdit" RowSelect="getSelectedRow"/>
            <Columns>
                <trirand:JQGridColumn DataField="docid" HeaderText="Document ID" PrimaryKey="True" Width="300" ShowToolTip="false" />
                <trirand:JQGridColumn DataField="invoice_number" HeaderText="Invoice Number" Width="300" ShowToolTip="false" />
                <trirand:JQGridColumn DataField="invoice_date" HeaderText="Invoice Date" Editable="true" EditType="DatePicker"
            EditorControlID="DatePicker1" DataFormatString="{0:dd/MM/yyyy}"  Width="350" ShowToolTip="false"/>
                <trirand:JQGridColumn DataField="cust_name" HeaderText="Customer Name" Editable="true" EditType="DropDown" 
            EditorControlID="CustomersDdl" Width="350" ShowToolTip="false"/>
                <trirand:JQGridColumn DataField="inv_splitter" HeaderText="Splitter" Editable="true" Width="300" ShowToolTip="false" />
                <trirand:JQGridColumn DataField="type" HeaderText="Type" Editable="true" Width="350" EditType="DropDown" EditValues="Invoice:Invoice;Credit Note:Credit Note" ShowToolTip="false"/> 
            </Columns>
            <PagerSettings PageSize="5" />  
            <AppearanceSettings ShowFooter="true" HighlightRowsOnHover="true" />
            <ToolBarSettings ShowEditButton="true" ShowAddButton="true" ShowDeleteButton="true" ShowSearchButton="True">
                <CustomButtons>
                    <trirand:JQGridToolBarButton
                        Text = "Preview"
                        ToolTip = "Preview"
                        ButtonIcon = "ui-icon-document"
                        Position = "Last" 
                        OnClick = "customButtonClicked"
                    />
                </CustomButtons>
                <CustomButtons>
                    <trirand:JQGridToolBarButton
                        Text = "Generate"
                        ToolTip = "Generate"
                        ButtonIcon = "ui-icon-copy"
                        Position = "Last" 
                        OnClick = "customButtonClicked2"
                    />
                </CustomButtons>
                <CustomButtons>
                    <trirand:JQGridToolBarButton
                        Text = "Download"
                        ToolTip = "Download"
                        ButtonIcon = "ui-icon-arrowstop-1-s"
                        Position = "Last" 
                        OnClick = "customButtonClicked3"
                    />
                </CustomButtons>
                <CustomButtons>
                    <trirand:JQGridToolBarButton
                        Text = "Email"
                        ToolTip = "Email"
                        ButtonIcon = "ui-icon-mail-closed"
                        Position = "Last" 
                        OnClick = "customButtonClicked4"
                    />
                </CustomButtons>
            </ToolBarSettings>
        <EditDialogSettings CloseAfterEditing="true" Caption="The Edit Dialog"  />
        <AddDialogSettings CloseAfterAdding="true" />                   
   </trirand:JQGrid>

Вот мой пользовательский CSS 

.ui-jqgrid .ui-jqgrid-view {
position: relative;
left: 0px;
top: 0px;
padding: 0;
font-size: 12px !important;
line-height: 23px !important;
}

.ui-jqgrid tr.jqgrow td {
height: 23px !important;
line-height: 23px !important;
white-space: normal !important;
}
...