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

两个div,一个固定宽度,另一个固定宽度

訾凯歌
2023-03-14
问题内容

我有两个div容器

虽然其中一个需要为特定宽度,但我需要对其进行调整,以便另一个div占用其余空间。有什么办法可以做到吗?

.left {

    float: left;

    width: 83%;

    display: table-cell;

    vertical-align: middle;

    min-height: 50px;

    margin-right: 10px;

    overflow: auto;

}



.right {

    float: right;

    width: 16%;

    text-align: right;

    display: table-cell;

    vertical-align: middle;

    min-height: 50px;

    height: 100%;

    overflow: auto;

}


<div class="left"></div>

<div class="right"></div> <!-- needs to be 250px -->

问题答案:

HTML:

<div class="right"></div>
<div class="left"></div>

CSS:

.left {
    overflow: hidden;
    min-height: 50px;
    border: 2px dashed #f0f;
}

.right {
    float: right;
    width: 250px;
    min-height: 50px;
    margin-left: 10px;
    border: 2px dashed #00f;
}

您也可以使用这样做display:table,这通常是一种更好的方法:如何将输入元素与其标签放在同一行?



 类似资料:
  • 问题内容: 我有两个div容器。 尽管一个需要为特定宽度,但我需要对其进行调整,以便另一个div占用其余空间。有什么办法可以做到吗? 问题答案: 请参阅: http : //jsfiddle.net/SpSjL/ (调整浏览器的宽度) HTML: CSS: 您也可以使用这样做,这通常是一种更好的方法:如何将输入元素与其标签放在同一行?

  • 问题内容: 我在一个父对象下有两个div ,父div的宽度为100%: 条件是: 我要在同一行上两个div。 右div可能存在或可能不存在。当它存在时,我希望它始终固定在右侧。但是,左div必须具有弹性-其宽度取决于其内容。 我已经尝试过float:left和dispaly:inline-block,但是似乎都没有解决方案。 任何建议,将不胜感激。 问题答案: 如果您不关心IE7,我会使用@san

  • 问题内容: 我是Java Swing的新手,对下一个代码感到困惑。 我的目标是制作带有 2个JTextPane的 垂直可滚动面板 。具有父面板固定宽度70%的第一个JTextPane和具有固定宽度30%的第二个JTextPane。因为这两个JTextPane具有固定的宽度,所以它们只能在垂直方向上扩展更多文本。 我使用此解决方案,因为我只想为此2个JTextPane使用一个滚动条。 我的初始化代码

  • 我是Java Swing的新手,我对下一个代码感到困惑。 null

  • 问题内容: 我正在尝试建立一个具有三列的flexbox布局,其中左列和右列具有固定的宽度,而中间列可以弯曲以填充可用空间。 尽管设置了列的尺寸,但它们似乎仍会随着窗口缩小而缩小。 有人知道如何做到这一点吗? 我需要做的另一件事是基于用户交互隐藏右列,在这种情况下,左列仍将保持其固定宽度,而中间列将填充其余空间。 问题答案: 除了使用(这是使用flexbox时的建议)之外,您还可以使用以下方法: =

  • 问题内容: 我正在寻找一种将2个div作为列的方法,其中右侧的div具有固定的宽度,左侧的div填充剩余空间。 有谁碰巧知道是否可以做到这一点? 我的尝试 (在block1下面提供了block2) : 问题答案: 您可以这样做: HTML: CSS: