html - 在此布局中仅使用 css 将导航栏向右移动？

Question

我正在尝试看看是否有可能只使用 CSS，我们就能得到这个。

HTML 是这样的(我将在这里简单地使用类名来说明它):

<body-wrapper>

<logo>
</logo>

<nav>
</nav>

<content>
</content>

<footer>
</footer>

</body-wrapper>

所需的最终 UI 布局应该是:

|--------------------|
|      logo          |
|--------------------|
|              |     |
|    content   | nav |
|              |     |
|              |     |
|--------------|     |
|     footer   |     |
|              |     |
|--------------|-----|

请注意，我们不知道 Logo 部分的确切高度。

我不知道如何做到这一点(或者仅使用 CSS 是否可行)。

有什么想法吗？

谢谢!(PS，如果我能够放置一个包含导航、内容和页脚的包装器 div，那么它会很容易做到这一点。但是当前的 HTML 没有那个，我想看看我们是否可以做到在不改变当前 HTML 的情况下工作)

Answer 1

既然您说您无权访问 html DOM，那么您也许可以按如下方式进行操作。

PS:我知道这很荒谬，而且很古怪，但我们正在处理一个非常边缘的案例，所以这里没有最佳实践的余地。 :)

.logo{
  width: 100%;
  float:left;
}
.nav{
  width:35%;
  float:right;
}
.content{
  width:65%;
  float:left;
}
.footer{
  width:65%;
  float:left;
}

JSFiddle