Javascript style minimum width

Style minWidth Property

The minWidth property sets or returns the minimum width of an element.

The minWidth property has effect only on block-level elements or on elements with absolute or fixed position.

Tip: To set or return the maximum width of an element, use the maxWidth property.

Browser Support

Syntax

Return the minWidth property:

Set the minWidth property:

Property Values

Value	Description
length	Defines the minimum width in length units. Default is 0
%	Defines the minimum width in % of the parent element
initial	Sets this property to its default value. Read about initial
inherit	Inherits this property from its parent element. Read about inherit

Technical Details

Default Value:	0
Return Value:	A String, representing the minimum width of an element
CSS Version	CSS2

More Examples

Example

Return the minimum width of a

element:

Related Pages

COLOR PICKER

HOW TO

SHARE

CERTIFICATES

Report Error

If you want to report an error, or if you want to make a suggestion, do not hesitate to send us an e-mail:

Thank You For Helping Us!

Your message has been sent to W3Schools.

Top Tutorials

Top References

Top Examples

Web Certificates

W3Schools is optimized for learning, testing, and training. Examples might be simplified to improve reading and basic understanding. Tutorials, references, and examples are constantly reviewed to avoid errors, but we cannot warrant full correctness of all content. While using this site, you agree to have read and accepted our terms of use, cookie and privacy policy. Copyright 1999-2020 by Refsnes Data. All Rights Reserved.
Powered by W3.CSS.

Источник

Javascript DOM Style minWidth Property

The minWidth property gets and sets the minimum width of an element.

The minWidth property only controls block-level elements or on elements with absolute or fixed position.

We can set or get the maximum width of an element via the maxWidth property.

Browser Compatibility

Syntax

Return the minWidth property:

let a = object.style.minWidth;

Set the minWidth property:

object.style.minWidth= "length|%|initial|inherit" 

Property Values

Default Value

Return Value

A String, representing the minimum width of an element.

More Examples

Return the minimum width of a

element:

console.log(document.getElementById("myP").style.minWidth);

!DOCTYPE html> html> body> p style="background:red;min-width:600px;" id="myP"> The minimum width of this paragraph is set to 600px. button type="button" onclick="myFunction()">Return min width  p id='demo'>  script> function myFunction() < document.getElementById('demo').innerHTML = document.getElementById("myP").style.minWidth; >   

Related

• Javascript DOM Style maxHeight Property
• Javascript DOM Style maxWidth Property
• Javascript DOM Style minHeight Property
• Javascript DOM Style minWidth Property
• Javascript DOM Style objectFit Property
• Javascript DOM Style objectPosition Property
• Javascript DOM Style opacity Property

demo2s.com | Email: | Demo Source and Support. All rights reserved.

Источник

Javascript Reference — HTML DOM Style minWidth Property

The min-width property in CSS controls the min width for block-level elements or elements with absolute or fixed position.

The minWidth property sets or gets the minimum width of an element.

Browser Support

minWidth	Yes	Yes	Yes	Yes	Yes

Syntax

Return the minWidth property:

var v = object.style.minWidth;

Set the minWidth property:

object.style.minWidth='length|%|initial|inherit' 

Property Values

Value	Description
length	Default to 0. Set the minimum width in length units.
%	Set the minimum width in percent of the container element
initial	Set to default value.
inherit	Inherit from parent element.

Technical Details

Example

The following code shows how to set the minimum width.

 !DOCTYPE html> html> head> style> #myDIV !--from ww w . j a v a 2s . co m--> width: 50%; background-color: yellow; >  body> button onclick="myFunction()">test div >"myDIV"> p>this is a test. this is a test. this is a test. this is a test. this is a test. this is a test. this is a test. this is a test.  script> function myFunction() < document.getElementById("myDIV").style.minWidth = "400px"; >   

The code above is rendered as follows:

Example 2

The following code shows how to get the minimum width.

 !DOCTYPE html> html> body> !-- w w w . j av a 2 s. co m--> p style="background:red;min-width:600px;" >"myP"> this is a test. this is a test. this is a test. this is a test. this is a test. this is a test. this is a test. this is a test. button type="button" onclick="myFunction()">Return min width  script> function myFunction() < console.log(document.getElementById("myP").style.minWidth); >   

The code above is rendered as follows:

java2s.com | © Demo Source and Support. All rights reserved.

Источник

Style minWidth Property

The minWidth property sets or returns the minimum width of an element.

The minWidth property has effect only on block-level elements or on elements with absolute or fixed position.

Tip: To set or return the maximum width of an element, use the maxWidth property.

Browser Support

The minWidth property is supported in all major browsers.

Syntax

Return the minWidth property:

Set the minWidth property:

Property Values

Value	Description
length	Defines the minimum width in length units. Default is 0
%	Defines the minimum width in % of the parent element
initial	Sets this property to its default value. Read about initial
inherit	Inherits this property from its parent element. Read about inherit

Technical Details

Default Value:	0
Return Value:	A String, representing the minimum width of an element
CSS Version	CSS2

More Examples

Example

Return the minimum width of a

element:

Related Pages

COLOR PICKER

LEARN MORE:

Your Suggestion:

Thank You For Helping Us!

Your message has been sent to W3Schools.

Top 10 Tutorials

Top 10 References

Top 10 Examples

Web Certificates

W3Schools is optimized for learning, testing, and training. Examples might be simplified to improve reading and basic understanding. Tutorials, references, and examples are constantly reviewed to avoid errors, but we cannot warrant full correctness of all content. While using this site, you agree to have read and accepted our terms of use, cookie and privacy policy. Copyright 1999-2016 by Refsnes Data. All Rights Reserved.
Powered by W3.CSS.

Источник