High score: DIV is either broken or truncated and hidden. How to adaptively display according to length_html/css_WEB-ITnose

The definition of DIV in CSS is as follows

div,li,td,p,select,input,textarea,a,button,input{font:12px Verdana, Arial, Helvetica, sans-serif;color:#505050;text-decoration: none;overflow:hidden;word-break:break-all;word-wrap: break-word; }

However, the content is either truncated, as shown below:


The content is either broken, Display directly outside, as shown below:



If refreshed, it can be displayed normally.
I don’t know how to solve it.

Please advise

Reply to discussion (solution)

CSS is defined as follows:

div,li,td,p,select,input,textarea,a,button,input{font:12px Verdana, Arial, Helvetica, sans-serif;color:#505050;text-decoration: none;overflow:hidden;word-break:break-all;word-wrap: break-word; }

overflow :hidden; After removing
, it will not be cut off, but it will burst

in both places.

Add a sentence to the CSS definition:

Height:auto;

Here comes the ultimate solution:

Add to your total container DIV This attribute: overflow:hidden;

Then add this attribute to your sub-container DIV: padding-bottom:100000px; margin-bottom:-100000px;

Another post by the original poster Here, I’ve also returned to see if I can get a reward of 200 meters

No, it’s still not done

No, it’s still not done

The real solution is this It is absolutely effective. I have tried:

1. If neither the parent DIV nor the child DIV has a defined height, and no float is used, the height will be adaptive and there will be no problem.

2. When you use float in a child DIV, you will find that the parent DIV no longer adapts to the height of the child DIV.

What we need to do at this time is:
Add an empty DIV after the float DIV, and then clear the float on this DIV.

Example:

<styletypestyletype="text/css">     #fatherDIV{border:#000000solid5px;}    #babyDIV1{border:#00ffffsolid5px;float:left}      #babyDIV2{border:#0033CCsolid5px;float:right} </style> <div id="fatherDIV">父div     <div id="babyDIV1">子div</div>     <div id="babyDIV2">子div</div>     <div style="clear:both">就是这个用于clear错误的</div></div>