当前位置: 首页 > 面试题库 >

div并排无浮点

谢胤
2023-03-14
问题内容

如何使div的“左”和“右”看起来并列?

我知道我可以在它们上面使用float:left,这将起作用…但是在此处的第5和第6步中,那个家伙说这是可能的,不过我无法正常运作…

码:

<style>
div.left {
    background:blue;
    height:200px;
    width:300px;
}

div.right{
    background:green;
    height:300px;
    width:100px;
}

.container{
    background:black;
    height:400px;
    width:450px;
}
</style>

<div class="container">
        <div class="left">
            LEFT
        </div>
        <div class="right">
            RIGHT
        </div>
</div>

问题答案:

不使用floats 时的常用方法是使用display: inline-block

.container div {
  display: inline-block;
}

不过,请注意其局限性:第一个块之后还有一个额外的空间-
这是因为这两个块现在基本上是inline元素,例如aem,所以两个计数之间的空格。这可能会破坏您的布局和/或看起来不太美观,并且我不希望为了该工作而去除字符之间的所有空白。

在大多数情况下,浮点数也更灵活。



 类似资料:
  • 当用户滚动内容时,我试图添加一个浮动div,它几乎可以工作,但在动画上几乎没有延迟,我需要当scrollTop到达浮动div时,浮动div应该与滚动一起动画 小提琴连杆

  • 问题内容: 我有一个小问题。我正在尝试使用CSS并排对齐两个div,但是,我希望将中心div放置在页面的水平中央,我通过使用以下方法实现了这一点: 很好 我想将第二个div放置在中心页面换行的左侧,但是尽管可以确定,但我无法使用浮点数来完成此操作。 我想将红色div推向白色div。 这是我当前关于这两个div的CSS,侧边栏是红色div,页面换行是白色div: 问题答案: 如果包裹了div,如下所

  • 问题内容: 我有一个设置100%宽度的主包装div。在里面,我想有两个div,一个是固定宽度的,另一个是填充其余空间的。我如何浮动第二个div来填充其余的空间。谢谢你的帮助。 问题答案: 有很多方法可以满足您的要求: 使用CSS 属性:

  • 问题内容: 我有一个父div,其中将包含2或3个子div。我希望子div自动采用相等的宽度。 谢谢 问题答案: 这不是不可能的。使用甚至还不是特别困难。 该解决方案将在现代浏览器中运行。在IE7中将无法使用。 CSS: HTML:

  • 问题内容: 我试图并排放置两个div,并使用以下CSS。 HTML很简单,在包装div中有两个左和右div。 我已经尝试了很多次,也在StackOverflow和其他站点上寻找更好的方法,但是找不到确切的帮助。 因此,代码乍一看效果很好。问题是,当我增加(%)的宽度时,左div自动获得填充/边距。因此,在65%的宽度处,左div有一些填充或边距,并且与右div并不完全对齐,我尝试填充/边距0但没有

  • 问题内容: 我有两个未嵌套的div,一个在另一个之下。它们都在一个父div内,并且该父div重复其自身。所以本质上: 我想每对以及彼此相邻。我怎样才能做到这一点? 问题答案: