Get the App
SLTechnology News&Howtos  ›  Development  › 

How css uses the fit-content () function

Shulou Source: shulou.com Published: 2022-06-01 02:37:11 10月03日 Update

This article is about how css uses the fit-content () function. The editor thinks it is very practical, so share it with you as a reference and follow the editor to have a look.

Fit-content ()

The fit-content function, which takes a parameter, the length value, can literally explain its function, "adapt to the content".

Test1dsssss3333333 sssssssssssssss sssssssssssssssssss sssssssssssssssssss ssssssssssssssssssss, this is fit-content (400px) test2, this is fixed width width:400px test3, this is fit-content (400px) .fit-content-wrapper {width: 100%; height: 200px; display: grid; grid-template-columns: fit-content (400px) 400px fit-content (400px); grid-gap: 10px;}. Fit-item {background-color: rgb (20,106,177);}

Effect.

As you can see, when the content length is greater than the given length, the text will automatically wrap and will not exceed the given length, and when the content length is less than the given length, the length will be set according to the given content length.

Compatibility

Compatibility is not a problem for modern browsers. New versions of mainstream browsers basically support it, but not for projects that need to support ie.

Thank you for reading! This is the end of the article on "how css uses the fit-content () function". I hope the above content can be of some help to you, so that you can learn more knowledge. if you think the article is good, you can share it for more people to see!

Tags: Length content function this is compatibility more browser article support browsing good practical function parameter literal width meaning effect text article Apple Docker Huawei Linux macOS MariaDB Microsoft MySQL NVidia OPPO Reno OPPO Reno MariaDB Apple Xiaomi Shulou Tech Info