javascript - 右列定宽,左列自适应且有最小宽度
phpcn_u1582
phpcn_u1582 2017-05-31 10:39:00
0
3
971

右列定宽,左列自适应,但当窗口缩到一定程度,让左列不再变小。我要实现这个效果,怎么布局?

phpcn_u1582
phpcn_u1582

全部回复(3)
phpcn_u1582

你这左列min-width:300px;当然不会再变小。其实最简单的写法是:

.left{
    float:left;
    display:inline-block;
    ...
}
.right{
    width: 600px;
    ...
}

而且是这个问题吗?怎么没看到问题呢?

后续:

        .wrapper{
            width:100%;
            position:relative;
            overflow: scroll;
            min-width: 900px;
        }
        .left{
            min-width: 300px !important;
            position: absolute;
            right: 600px;
            background-color: yellow;
            height:500px;
            width: 100%;
        }
        .right{
            width: 600px;
            height:500px;
            float: right;
            background-color: red;
        }

这样应该满足你的需求,但是也不知道最后小于900px你是要怎么呈现,我就直接用滚动条了

某草草

雷雷

我想大声告诉你

.con(.l,.r)
.con
display:flex;
flex-wrap:nowrap;
width:100%;
height:xpx;
.l
....
.r
....
应该可以 应该看的懂吧
不过设置定宽还是看你了
flex其实用比例更好

热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板