Question

在我的网站上，我有一个包含两个其他div的div。左内部div的宽度很薄，而右边div则相当宽（由文本组成）。

当我减小窗口的宽度时，一旦我到达最右边的内部div的最右边，整个div（及其所有内容）都会包裹在左边内部div之下。当我进一步调整窗口大小时，曾经正确的div的内容（文本）开始包装。

基本上，我有这段代码：

<style type="text/css">
#wrapper {
  width: 100%;
}

#leftdiv {
  float: left;
}
</style>

<div id="wrapper">
  <div id="leftdiv">
    shortleft
  </div>
  <div id="rightdiv">
    longrightlongrightlongright
  </div>
</div>

但是，我希望右边div中的文本在整个div包裹到左边div之前。我可以做些什么来修改我的代码以实现这一目标？

Answer 1

试试这个：

#wrapper {
  width: 100%;
 }

#leftdiv {
  width: 20%;
  float: left;
}

#rightdiv {
  width: 79%
  float: right;
 }

如果您想看到这一点，请查看我的网页

http://sherwoods-forests.com

Percents永远不应该加到100.当渲染引擎计算像素数时，由于四舍五入，你有时会得到奇怪的结果。

左侧的导航栏就是这样完成的在内容div中，每张图片及其标题都向左或向右浮动，主体文本环绕。您还需要使用嵌入式div的边距

在整个包装之前，如何在内部进行内部div包装？

1 个答案: