ਕਿਵੇਂ ਫਲਟਿੰਗ ਨੂੰ ਸ਼ੁੱਧ ਕਰਨਾ (Clearfix)

Clearfix ਟੈਕਨੀਕ ਨੂੰ ਸ਼ੁਰੂ ਕਰੋ

clearfix ਟੈਕਨੀਕ

ਜੇਕਰ ਇੱਕ ਅੰਗਰੇਜ਼ੀ ਕੰਟੇਨਰ ਤੋਂ ਉੱਚਾ ਹੈ ਅਤੇ ਉਹ ਫਲਟਿੰਗ ਹੈ, ਤਾਂ ਉਹ ਆਪਣੇ ਕੰਟੇਨਰ ਤੋਂ ਬਾਹਰ ਨਿਕਲ ਜਾਵੇਗਾ。

ਤਦ, ਅਸੀਂ ਇਸ ਸਮੱਸਿਆ ਨੂੰ ਹੱਲ ਕਰਨ ਲਈ ਕੰਟੇਨਰ ਅੰਦਰ overflow: auto; ਜੋੜ ਸਕਦੇ ਹਾਂ:

ਉਦਾਹਰਣ

.clearfix {
  overflow: auto;
}

亲自试一试

ਜਦੋਂ ਤੁਸੀਂ ਬਾਹਰੀ ਅਤੇ ਅੰਦਰੂਨੀ ਮਾਰਜਿਨ ਕੰਟਰੋਲ ਕਰ ਸਕਦੇ ਹੋoverflow:auto ਫਲਟਿੰਗ ਨੂੰ ਸ਼ੁੱਧ ਕਰਨਾ ਬਹੁਤ ਚੰਗਾ ਹੈ (ਨਹੀਂ ਤਾਂ ਤੁਸੀਂ ਸਰਕਲਰ ਵੇਖ ਸਕਦੇ ਹੋ)。

ਪਰ, ਨਵੇਂ, ਆਧੁਨਿਕ clearfix ਟੈਕਨੀਕ ਨੂੰ ਵਰਤਣਾ ਸੁਰੱਖਿਅਤ ਹੈ, ਮਿਆਰੀ ਵੈੱਬਸਾਈਟਾਂ ਨੇ ਨਿਮਨਲਿਖਤ ਕੋਡ ਵਰਤਿਆ ਹੈ:

ਉਦਾਹਰਣ

.clearfix::after {
  content: "";
  clear: both;
  display: table;
}

亲自试一试

相关页面

教程：CSS 浮动