Window Dimensions

By default, Window HTML helper does not have any preset dimensions and its size depends on its content.

Manual Size Control

Apart from the automatic size calculation, the Width() and the Height() of the HTML helper could be explicitly set in pixels. Here is a small example demonstrating such scenario:

Example
@(Html.Kendo().Window()
    .Name("window")
    .Title("Alvar Aalto")
    .Width(300)
    .Height(250)
    .Content(@<text>
        <p>
            Alvar Aalto is one of the greatest names in modern architecture and design.
            Glassblowers at the iittala factory still meticulously handcraft the legendary vases
            that are variations on one theme, fluid organic shapes that let the end user decide the use.
        </p>
    </text>)
)

The Window HTML helper also allows configuration for its min and max dimensions (height and width). Here is an example of such configuration:

Example
@(Html.Kendo().Window()
    .Name("window")
    .Title("Alvar Aalto")
    .MinWidth(150)
    .MaxWidth(450)
    .MinHeight(200)
    .MaxHeight(300)
    .Content(@<text>
        <p>
            Alvar Aalto is one of the greatest names in modern architecture and design.
            Glassblowers at the iittala factory still meticulously handcraft the legendary vases
            that are variations on one theme, fluid organic shapes that let the end user decide the use.
        </p>
    </text>)
)

Size Adjustment According to its Content

If the Window contains horizontally expandable block-level elements—including other HTML helpers such as the Grid, Editor, and others—the widget can expand horizontally to the point of touching the right edge of the browser viewport. In such cases, the widget sticks to the right viewport edge and cannot be separated from it. This issue occurs because the Window is absolutely positioned with CSS. To avoid such behavior, set an appropriate width to the widget, or a (max-)width to its content.

The lack of restrictions over the dimensions for vertical expanding of the Window and its content might result in undesired behavior—for example, the rendition of a popup which is higher than the browser viewport.

If the Window uses an iframe element, it does not resize automatically according to the iframe content, because there is no relationship between the content and size of the iframe. However, iOS devices do not support iframe scrolling and expand iframes according to their content, which might increase the Window height too much. That is why it is not recommended to use the Window in an iframe mode on Apple touch devices.

See Also

In this article
Not finding the help you need? Improve this article