Menu
fit-content as min- or max-widthYou can also use fit-content as a min-width or max-width value; see the example above. The first means that the width of the box varies between min-content and auto, while the second means it varies between 0 and max-content.
max-width overrides width , but min-width overrides max-width .
"width" is a standard width measurement for defining the exact width of an element. Defining "width:100%" means that the width is 100%. Defining "max-width:100%" means that the width can be anywhere between 0% and 100% but no more then 100%. For example if my display has a 1200px availible width.
The max-width property defines the maximum width of an element. If the content is larger than the maximum width, it will automatically change the height of the element. If the content is smaller than the maximum width, the max-width property has no effect.
Not the best title, but anyway...
I have an element with a max-width and some text.
If the text is longer than will fit on one line, I get this:
----------------------------
|My text here, hello |
|everyone! |
----------------------------
In other words, it takes up the full max-width, but there's an empty space on the right due to the word moving down.
Is there any way to make it so that this happens instead?
---------------------
|My text here, hello|
|everyone! |
---------------------
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With