宽度设置为100％时Div重叠，但像素宽度设置时不重叠？

本文介绍了宽度设置为100％时Div重叠，但像素宽度设置时不重叠？的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

我正在进行练习布局，在那里我设置了一个包装器Div并将CSS中的宽度设置为100％，并将其最小宽度设置为800px，但是在此包装器内部，当我调整大小时，其他内容会重叠窗口。我的html页面

I'm working on a layout for practice and there I set a wrapper Div and set the Width in CSS 100% and also its min-width:800px, but inside of this wrapper Div other content get overlapped when I resize the window. My html page

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width" />
    <title>@ViewBag.Title</title>
    <link href="~/Content/themes/MyStyle.css" rel="stylesheet" />
    </head>
<body>
    <div id="wrapper">
        <div class="header">
            <div style="display:inline-block;width:400px;margin:5px 0 0 100px">This is my site</div>
            <div style="display:inline-block;width:500px;margin:5px 0 0 20px"><input type="text"/>  <input type="button" value="Search"/>  </div>
            <div style="display:inline-block;margin:5px 0 0 50px">@Html.Label("","LogIn","")       @Html.Label("SignIn")</div>
        </div>
    <div>@RenderBody()</div>
        </div>
</body>
</html>

我的Css

My Css

body,html,div,form {
margin:0;
padding:0;
}


#wrapper {
width:100%;
min-width:800px;
}

.header {
width:100%;
height:35px;
background-color:rosybrown;
}

所以我的问题是那个如果我将它设置为像素，那么我的标题div不会在大屏幕上消耗，而且它的内容也会隐藏在小屏幕上。我完全没有想法和谷歌搜索这个问题但没有得到任何解决方案。

这是 [如果有人想查看

推荐答案

style="float:left;" //left/Right/Center as per your control's position

对于未修复屏幕大小的应用程序，请转到（％）。并且

For your application where the size of the screen is not fixed , go for (%). And the child content inside the

中的子内容必须以（％）百分比指定。

must to be specified with (%) percentage.

这篇关于宽度设置为100％时Div重叠，但像素宽度设置时不重叠？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！