Html 提出正确的问题_Html_Css

Html 提出正确的问题

html css

Html 提出正确的问题,html,css,Html,Css,以下是链接：代码如下： <body> <div class="site" style="background:yellow; "> <div class="banner" style="background:blue; height:100px; width:417px; float:left;">Banner Banner Banner Banner Banner </div> <div class="a

以下是链接：

代码如下：

  <body>


<div class="site" style="background:yellow; "> 

<div class="banner" style="background:blue; height:100px; width:417px; float:left;">Banner   Banner   Banner   Banner   Banner   </div>
<div class="ads" style="background:green; height:800px; width:160px; float:right;">Ads  Ads  Ads  Ads  Ads  Ads  Ads  Ads  Ads  </div>
<div class="tree" style="background:orange; height:400px; width:auto; min-width:417px; clear:left;">Tree   Tree   Tree   Tree   Tree   Tree   </div>

</div>


  </body>


横幅
广告
树树树

我希望绿色div保持在顶部，橙色div内容不在绿色div后面，橙色div的最小宽度为417px。提前感谢您提供的任何帮助

Dusty

您的代码中有一个输入错误：

<div class="tree" 
  style="background:orange; height:400px; width:auto; min-width:4170px; clear:left;">
   Tree   Tree   Tree   Tree   Tree   Tree
</div>


树树树

您已将

minwidth

设置为

4170px

将其更改为

417px

，所有问题都将消失。

将“site”div用作包装器/容器-将其最小宽度设置为树的最小宽度+ads的宽度-417+160=577px

<div class="site" style="background:yellow; min-width: 577px;">

然后，每当你下降到这个宽度以下，它就不会把绿色的“广告”拉到所有东西的顶部。如果在树或ads div中添加padding/margin，则必须将其添加到容器的最小宽度中

我不在乎正文的边距/填充/边框。如果你缩小页面，你会看到我在说什么。你只是担心橙色部分的内容会被放在广告面板下面吗？谢谢你，乔治！这就清楚了很多，但现在我有第二个问题。假设橙色部分有文字。。。我如何获得文本以将绿色div从屏幕上推出。重新更新，更简单的修复。