如何在一个div旁边浮动两个div？ [英] how to float two divs beside one div?

问题描述

在我的网页中，我想要一些类似于结构的东西：

I want something below like structure in my webpage:

    +---------------+ +-----------+
    |               | |           |
    |               | |   Div-B   |
    |               | |Float:left |
    |               | |           |
    |     Div-A     | |           |
    |  Float: left  | +-----------+
    |               | +-----------+
    |               | |  Div-C    |
    |               | |<marquee>  |
    |               | |</marquee> |
    |               | +-----------+
    |               |
    +---------------+

但是我不能像上面那样创建Div-C。如果我给出Div-C的不同背景颜色，它将延伸到Div-A的左边界。所以我不能在Div-A和Div-C之间留出空白。它变成这样：

But I can't creat Div-C like above style. If I give a different background color of Div-C, it extends to left border of Div-A. So I can't make white spaces between Div-A and Div-C. It is becoming like this:

+---------------+ +-----------+
|               | |           |
|               | |   Div-B   |
|               | |Float:left |
|               | |           |
|     Div-A     | |           |
|  Float: left  | +-----------+
|---------------|-+-----------+
|                    Div-C    |
| (Background color fills     |
|       this whole section    |
|---------------|-+-----------+
|               |
+---------------+

另请注意，Div-C包含一个选取框。
请给我解决方案。

Also note that Div-C contains a marquee. Please give me solution.

推荐答案

你不使用这样的事情：（工作jsFiddle ）

Why don't you use something like this: (working jsFiddle)

HTML：

HTML:

<div id="mainContainer">
    <div id="divA"></div>
    <div id="divB"></div>
    <div id="divC"></div>
</div>

CSS：

CSS:

#mainContainer{ overflow:hidden; }
#divA{ float:left; width:60%; }
#divB{ float:right; width:30%; }
#divC{ float:right; width:30%; }

这篇关于如何在一个div旁边浮动两个div？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！