CSS min-inline-size ਪ੍ਰਤੀਯੋਗਤਾ ਪ੍ਰਤੀਯੋਗਤਾ

ਪਰਿਭਾਸ਼ਾ ਅਤੇ ਵਰਤੋਂ

min-inline-size ਪ੍ਰਤੀਯੋਗੀ ਇਲੈਕਟ੍ਰੋਨ ਦੀ ਕ੍ਰਮਵਾਧੀ ਸਿਜ਼ ਵਿੱਚ ਕਿਸੇ ਵੀ ਦਿਸ਼ਾ ਵਿੱਚ ਸਭ ਤੋਂ ਘੱਟ ਮਾਪ.

ਜੇਕਰ ਸਮਾਂ ਵਿੱਚ ਦਿਸ਼ਾ 'ਤੇ ਸਮਾਂ ਦਾ ਮਾਪ ਸਭ ਤੋਂ ਛੋਟੀ ਮਾਪ ਤੋਂ ਘੱਟ ਹੈ ਤਾਂ min-inline-size ਨਾਲ ਲਾਗੂ ਹੋਵੇਗਾ。

ਗੁਣ ਮੁੱਲ min-inline-size ਜੇਕਰ ਸਮਾਂ ਵਿੱਚ ਦਿਸ਼ਾ 'ਤੇ ਸਮਾਂ ਦਾ ਮਾਪ ਸਭ ਤੋਂ ਛੋਟੀ ਮਾਪ ਤੋਂ ਵੱਧ ਹੈ ਤਾਂ

ਗੁਣ ਮੁੱਲ ਨਹੀਂ ਕੰਮ ਕਰਦਾ ਹੈ。ਧਿਆਨ: writing-mode ਲਾਈਨ ਅੰਦਰ ਦਿਸ਼ਾ ਨੂੰ ਪਰਿਭਾਸ਼ਿਤ ਕਰਦਾ ਹੈ, ਇਹ ਲਾਈਨ ਅੰਦਰ ਦੇ ਸਬੰਧਤ CSS ਗੁਣਾਂ ਨੂੰ ਪ੍ਰਭਾਵਿਤ ਕਰਦਾ ਹੈ: min-inline-size ਇੰਗਲਿਸ਼ ਪੰਨਿਆਂ ਲਈ, ਬਲਕ ਦਿਸ਼ਾ ਹੇਠਾਂ ਹੁੰਦੀ ਹੈ ਅਤੇ ਲਾਈਨ ਅੰਦਰ ਦਿਸ਼ਾ ਵੱਲੋਂ ਸੱਜੇ ਤੋਂ ਬਾਏ ਹੁੰਦੀ ਹੈ。

ਗੁਣ ਦੇ ਨਤੀਜੇ min-inline-size CSS min-height ਗੁਣ ਨੂੰ ਸਮਾਨ ਕੀਤਾ ਗਿਆ ਹੈ ਜਿਵੇਂ ਕਿ CSS ਗੁਣ ਅਤੇ min-width min-inline-size ਬਹੁਤ ਹੀ ਸਮਾਨ ਲੱਗਦਾ ਹੈ, ਪਰ

ਗੁਣ ਨਾਲ ਲਿਖਣ ਦੀ ਦਿਸ਼ਾ ਉੱਤੇ ਨਿਰਭਰ ਕਰਦਾ ਹੈ。

ਇਨਸਟੈਂਸ

ਉਦਾਹਰਣ 1

div {
  min-inline-size: 200px;
}

ਆਪਣੇ ਅਨੁਭਵ ਕਰੋ

ਉਦਾਹਰਣ 2: ਲਿਖਣ ਦੀ ਪ੍ਰਕਿਰਿਆ

ਦੇ <div> ਤੱਤ ਦੀ writing-mode writing-mode ਦੇ ਰੂਪ ਵਿੱਚ vertical-rl ਦੇ ਮੁੱਲ ਨੂੰ ਸੈਟ ਕਰਨ ਨਾਲ ਲਾਈਨ ਅੰਦਰ ਦਿਸ਼ਾ ਪਾਸੇ ਤੋਂ ਹੇਠਾਂ ਤੋਂ ਬਦਲ ਜਾਵੇਗੀ ਅਤੇ ਇਹ min-inline-size ਗੁਣ ਦੇ ਕੰਮ ਕਰਨ ਦੇ ਤਰੀਕੇ ਨੂੰ ਪ੍ਰਭਾਵਿਤ ਕਰੇਗਾ:

div {
  min-inline-size: 260px;
  writing-mode: vertical-rl;
}

ਆਪਣੇ ਅਨੁਭਵ ਕਰੋ

ਉਦਾਹਰਣ 3: min-inline-size ਅਤੇ inline-size

ਇੱਕ ਉਦਾਹਰਣ ਦੇਖੋ inline-size 200px ਦੇ <div> ਤੱਤ ਅਤੇ ਦੂਜੇ min-inline-size 200px ਦੇ <div> ਤੱਤ ਨੂੰ ਸਮਾਂ ਵਿੱਚ ਸਮਾਂ ਵਿੱਚ ਵੱਖ-ਵੱਖ ਪ੍ਰਦਰਸ਼ਨ ਲਈ:

#div1 {
  min-inline-size: 200px;
}
#div2 {
  inline-size: 200px;
}

ਆਪਣੇ ਅਨੁਭਵ ਕਰੋ

CSS ਗਰੰਥ

min-inline-size: auto|length|initial|inherit;

ਗੁਣ ਮੁੱਲ

ਤਕਨੀਕੀ ਵੇਰਵੇ

ਬਰਾਉਜ਼ਰ ਸਮਰਥਨ

ਸਤਰ ਵਿੱਚ ਦਿਸਦੇ ਸੰਖਿਆਵਾਂ ਇਸ ਗੁਣ ਦਾ ਪਹਿਲਾ ਪੂਰੀ ਤਰ੍ਹਾਂ ਸਮਰਥਨ ਕਰਨ ਵਾਲਾ ਬਰਾਉਜ਼ਰ ਦੀ ਸੰਸਕਰਣ ਨੂੰ ਦਰਸਾਉਂਦੇ ਹਨ。

ਸਬੰਧਤ ਪੰਨੇ

ਸਬੰਧਤ ਸਰੋਤਾਂCSS inline-size ਪ੍ਰਤੀਯੋਗਿਤਾ

ਸਬੰਧਤ ਸਰੋਤਾਂCSS max-inline-size ਪ੍ਰਤੀਯੋਗਤਾ ਪ੍ਰਤੀਯੋਗਤਾ

ਸਬੰਧਤ ਸਰੋਤਾਂCSS min-height ਪ੍ਰਤੀਯੋਗਤਾ ਪ੍ਰਤੀਯੋਗਤਾ

ਸਬੰਧਤ ਸਰੋਤਾਂCSS min-width ਪ੍ਰਤੀਯੋਗਤਾ ਪ੍ਰਤੀਯੋਗਤਾ

ਸਬੰਧਤ ਸਰੋਤਾਂCSS ਵਰਟਿੰਗ-ਮੋਡ ਪ੍ਰਾਪਰਟੀ