Emit width and height for img elements automatically, to avoid layout shifts

Questions
,
1

Is there a way to get width and height for img elements emitted automatically? We want to use this as one way to avoid layout shifts, and CSS as another way.

We use accelerator code like @Html.ImageFor(p => i.VariantImage, maxSize: new Size(100, 100) ... ) to emit images in templates.

Can you get Litium.Web.Mvc.HtmlHelperExtensions.ImageFor() (used above) to emit width and height? Or can you get the dimensions some other way to emit them at render time? Since Litium makes a thumbnail with the desired dimensions it feels like it should be able to tell you those dimensions.

Litium version: 7 + accelerator

1 Like
2

You can send in renderSizeAttributes to @Html.ImageFor. It will render width and height

@Html.ImageFor(x => x.Image, maxSize: new Size(786, -1), renderSizeAttributes: true)
1 Like
3

This topic was automatically closed 28 days after the last reply. New replies are no longer allowed.