Back to Devexpress

DxHtmlEditor.TableColumnMinWidth Property

blazor-devexpress-dot-blazor-dot-dxhtmleditor-775db8e1.md

latest3.1 KB
Original Source

DxHtmlEditor.TableColumnMinWidth Property

Specifies the minimum width of table columns.

Namespace : DevExpress.Blazor

Assembly : DevExpress.Blazor.v25.2.dll

NuGet Package : DevExpress.Blazor

Declaration

csharp
[DefaultValue(40)]
[Parameter]
public int TableColumnMinWidth { get; set; }

Property Value

TypeDefaultDescription
Int3240

The minimum column width in pixels.

|

Remarks

Enable the TableResizeEnabled property to allow users to resize tables. In code, you can use TableColumnMinWidth and TableRowMinHeight properties to specify minimum column width and row height.

Note

Column width may depend on content. Tables don’t trim content; they can only wrap content at standard breakpoints (whitespaces).

Example

The following code snippet allows users to resize tables and configures the minimum column width and row height:

razor
<DxHtmlEditor Markup="@markup"
              TableResizeEnabled="true"
              TableColumnMinWidth="100"
              TableRowMinHeight="50"
              Height="300px"
              Width="100%" />

@code {
    string markup = "";
    protected override void OnInitialized() {
        markup = GetData();
    }
}
csharp
public string GetData() {
    return $@"<p>Supported browsers:
                <table>
                    <tbody>
                        <tr>
                            <td><strong>Google Chrome (including Android)</strong></td>
                            <td>Latest</td>
                        </tr>
                        <tr>
                            <td><strong>Apple Safari (including iOS)</strong></td>
                            <td>Latest</td>
                        </tr>
                        <tr>
                            <td><strong>Mozilla Firefox</strong></td>
                            <td>Latest</td>
                        </tr>
                        <tr>
                            <td><strong>Microsoft Edge</strong></td>
                            <td>Latest</td>
                        </tr>
                        <tr>
                            <td><strong><a href='https://support.microsoft.com/en-us/microsoft-edge/what-is-microsoft-edge-legacy-3e779e55-4c55-08e6-ecc8-2333768c0fb0' rel='noopener noreferrer' target='_blank'>Microsoft Edge Legacy</a></strong></td>
                            <td>Not supported</td>
                        </tr>
                    </tbody>
                </table>
                
";
}

See Also

DxHtmlEditor Class

DxHtmlEditor Members

DevExpress.Blazor Namespace