当前位置:Gxlcms > html代码 > 两个div并排,右边的div需要铺满剩余空间?_html/css_WEB-ITnose

两个div并排,右边的div需要铺满剩余空间?_html/css_WEB-ITnose

时间:2021-07-01 10:21:17 帮助过:77人阅读

两个div并排,右边的div需要铺满剩余空间?该如何定义CSS

<%@ page contentType="text/html;charset=UTF-8" language="java" %>        <%----%>        
DIV1
DIV2


两个div并排,右边的div需要铺满剩余空间?该如何定义CSS


回复讨论(解决方案)

你试试看div2右浮动,然后给两个div设置固定宽度,

div2 width: 85%;

你试试看div2右浮动,然后给两个div设置固定宽度,


右浮动?能给出具体的代码吗?

div2 width: 85%;


这个方法我用了,有没有更简便的方法?

第一种,都向左浮动, width 各占相应百分比(注意div1 ,div2 有padding margin 等属性会影响宽度 )
两div高度可以不一样,
div1 15% + div1 85% = 100% 宽



第二种 仅div1 左浮动,div2 100%宽(不浮动), div1 自然覆盖在div2上,再对div2做相应处理。
这种适合左边的高度 大于或等于右边的高度。
.div1 {
float: left; width: 15%;
background-color: lightseagreen;
}

.div2 {
width: 100%;
background-color: chocolate;
}

.div2增加属性

width: 85%;

人气教程排行