Skip to content
This repository was archived by the owner on Nov 16, 2023. It is now read-only.
This repository was archived by the owner on Nov 16, 2023. It is now read-only.

Image has zero height when it receives imageFit without a height and width #410

Open
@swese44

Description

@swese44

Fabric Image renders an image within a div. When it receives an imageFit prop, the image is displayed absolutely within the div and the div doesn't actually have any dimension unless we provided a height and width.

This makes responsive images impossible to achieve at the moment while using imageFit. Height and width accept a number px value only, allowing a percent or "auto" will not solve this because the wrapping div can't maintain an aspect ratio.

One solution could be to support a new aspectRatio prop. If provided, this could set width: 100% and height: 0, with paddingTop: ${aspectRatio * 100}%

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions