如何让 div 填充剩余的水平空间?

沃梦达教程前端问题

2022-01-01

How to make a div fill a remaining horizontal space?(如何让 div 填充剩余的水平空间?)

本文介绍了如何让 div 填充剩余的水平空间?的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

I have 2 divs: one in the left side and one in the right side of my page. The one in the left side has fixed width and I want the one of the right side to fill the remaining space.

#search {
  width: 160px;
  height: 25px;
  float: left;
  background-color: #ffffff;
}

#navigation {
  width: 780px;
  float: left;
  background-color: #A53030;
}

<div id="search">Text</div>
<div id="navigation">Navigation</div>

解决方案

This seems to accomplish what you're going for.

#left {
  float:left;
  width:180px;
  background-color:#ff0000;
}
#right {
  width: 100%;
  background-color:#00FF00;
}

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

这篇关于如何让 div 填充剩余的水平空间?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持编程学习网！

沃梦达教程

本文标题为：如何让 div 填充剩余的水平空间?

上一篇：我应该用'name'还是'id'制作HTML锚?

下一篇： <元字符集=“utf-8">vs<meta http-equiv=“Content-Type">