The 2 divs are displayed side by side, and a line break will appear when the browser interface is reduced. How to solve_html/css

The 2 divs are displayed side by side, and a line break will appear when the browser interface is reduced. How to solve_html/css_WEB-ITnose

WBOY

Release： 2016-06-24 11:40:00

Original

1896 people have browsed it

<!DOCTYPE html><html><head>	<title></title>	<link rel="stylesheet" href="test.css"></head><body><div id="parent" style="display:inline"><div id="child1" style="display:inline">1111111111111111111111111111111111111111111111111</div><div id="child2" style="display:inline">2222222222222222222222222222222222222222222222222222222222222222222222222</div></div> </body></html>

Copy after login

@charset: "utf-8";#child1{	background: blue;}#child2{	background:red;}

Copy after login

2 divs are displayed side by side, and a line break will appear when the browser interface is reduced. How to solve

Reply to discussion (solution)

parent setting minimum width

parent setting Minimum width

Can someone give me an example? I am a beginner and can’t understand it at all. I just learned it for a few days.

<!DOCTYPE html><html><head>	<style>    #parent{        display: block; /* div 默认 block 级别, inline 会使 尺寸类属性失效 */        min-width:2000px;    }    #parent>div{        display:inline;    }    #child1{        background: blue;    }    #child2{        background: red;    }    </style></head><body><div id="parent"><div id="child1">1111111111111111111111111111111111111111111111111</div><div id="child2">2222222222222222222222222222222222222222222222222222222222222222222222222</div></div></body></html>

Copy after login

The length and width of the parent are not specified.