HTML 问题:多个 Div 浮动

发布于 2024-12-10 05:38:55 字数 704 浏览 0 评论 0原文

我现在正在解决这个问题 1 小时:How to make "Field Item 2" float at the right site of "Field Item 1" 这对于 CSS 来说是可能的吗?或者两者之间是否有太多的div? 有什么想法吗?晒很多!

<html>
<head>
    <title>Test float</title>
</head>

<body>
    <div class="group-header user-slogan">
        <div class="field field-name-field-user-slogan field-type-text field-label-hidden">
            <div class="field-items">
                <div class="field-item even">Field Item1</div>
            </div>
        </div>
        <div class="even zitatgeber" style="float:left;">Field Item2</div>
    </div>
</body>
</html> 

I'm sitting now 1 hour working on this problem: How to make "Field Item 2" float at the right site of "Field Item 1" Is that possible with CSS at all? Or are there too may divs in between?
Any idea? Tanx a lot!

<html>
<head>
    <title>Test float</title>
</head>

<body>
    <div class="group-header user-slogan">
        <div class="field field-name-field-user-slogan field-type-text field-label-hidden">
            <div class="field-items">
                <div class="field-item even">Field Item1</div>
            </div>
        </div>
        <div class="even zitatgeber" style="float:left;">Field Item2</div>
    </div>
</body>
</html> 

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(3

绿光 2024-12-17 05:38:55

您可能想尝试一下,添加 style="float:left;"进入与Field Item2同级的div,并将Field Item2的样式更改为float:right。就是这样:

<body>
<div class="group-header user-slogan">
    <div class="field field-name-field-user-slogan field-type-text field-label-hidden" style="float:left;">
        <div class="field-items">
            <div class="field-item even">Field Item1</div>
        </div>
    </div>
    <div class="even zitatgeber" style="float:right;">Field Item2</div>
</div>
</body>

记住添加左右的特定宽度,这样项目才能正确浮动。

You might want to try this, add style="float:left;" into the div which is in the same level with the Field Item2, and change the style of Field Item2 to float:right. Here it is:

<body>
<div class="group-header user-slogan">
    <div class="field field-name-field-user-slogan field-type-text field-label-hidden" style="float:left;">
        <div class="field-items">
            <div class="field-item even">Field Item1</div>
        </div>
    </div>
    <div class="even zitatgeber" style="float:right;">Field Item2</div>
</div>
</body>

Remember to add the specific width for the left and right, so the item will float correctly.

冷…雨湿花 2024-12-17 05:38:55

您应该在两个 div 上使用 float:left

You should use float:left on both the divs

记忆里有你的影子 2024-12-17 05:38:55

也许,您应该指定父 div 的宽度并获取要在其内部浮动的 div(父级)。

试试这个:

<html>
<title>Test float</title>
</head>

<body>
<div class="group-header user-slogan">
    <div class="field field-name-field-user-slogan field-type-text field-label-hidden">
        <div class="field-items" style="width: AAApx;">
            <div class="field-item even" style="float:left;">Field Item1</div>
            <div class="even zitatgeber" style="float:left;">Field Item2</div>
        </div>
    </div>

</div>

</body>
</html>

如果父 div 充当块级元素,您还可以将第二个项目 div 向右浮动

Probably, you should specify width for your parent div and take the div you want to float inside it(parent).

Try this :

<html>
<title>Test float</title>
</head>

<body>
<div class="group-header user-slogan">
    <div class="field field-name-field-user-slogan field-type-text field-label-hidden">
        <div class="field-items" style="width: AAApx;">
            <div class="field-item even" style="float:left;">Field Item1</div>
            <div class="even zitatgeber" style="float:left;">Field Item2</div>
        </div>
    </div>

</div>

</body>
</html>

You can also float the second item div to the right if the parent div behaves as a block level element

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文