CSS implementations prevent page layouts from being corrupted by large size pictures and long strings

css| Page | string

Use table and div to do page layout design, encounter large size pictures and long English string, layout defined in the size will be destroyed, resulting in page layout deformation.

Is there any way to solve it?

The CSS attribute Overflow:hidden can be controlled so that the outside part is automatically hidden, so the bad thing is that this part of the information display is not complete, such as the picture shows only a part. But the page layout is not messy.

It is important to note that when using overflow, you must define width, percentages, or specific values.

In the use of Div to do page layout, you can define a large layout, such as in the left column, right column, in the column inside, can also be specific to the page of a layout element.

In the use of UL and Li do picture list arrangement, you can also use this, so as to avoid some large size map mess layout, you can also solve the browser window narrowing, Li elements automatically back row alignment error problem.

BTW: With Overflow:auto, but also in the page to imitate the effect of the IFRAME, back to write

No use of overflow:hidden<br/>
<div style= "Width:200px;background:green;color: #fff;p adding:8px" >
Here's a picture with a width greater than 200px! <br/>

</div>
<br/>
Using the overflow:hidden<br/>
<div style= "Overflow:hidden;width:200px;background:green;color: #fff;p adding:8px" > here also put the picture to compare the effect Ah! <br/>

</div>