如何创建一个固定大小的两个div和另一个100%

时间:2022-09-05 21:27:06

I want create two DIV. Left DIV has a background with image. The size of this image is always 100% of DIV. So if I change resolution I have image in small size. In the right I have another div with fixed width.

我想创建两个DIV。左DIV具有图像背景。此图像的大小始终为DIV的100%。因此,如果我改变分辨率,我会有小尺寸的图像。在右边我有另一个固定宽度的div。

HTML Code

<div id="left">Test1</div>
<div id="right">Test</div>
<div style="clear: both;"></div>

CSS Code

#left{
    float: left;
    background: url('http://www.dladziecibajki.com/tapety/21790373a4e876e9dfe1d3949a2d5345_1344597749.jpg') 0 0;
    width: 100%;
    height: 100%;
    position: relative;
}
#right{
    float: left;
    width: 380px;
    height: 100%;
}

This is my code: jsfiddle

这是我的代码:jsfiddle

Kind regards

1 个解决方案

#1


1  

Demo Fiddle

HTML

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

CSS

#left {
    background: url('http://www.dladziecibajki.com/tapety/21790373a4e876e9dfe1d3949a2d5345_1344597749.jpg') 0 0;
    height: 100%;
    overflow:hidden;
}
#right {
    float: left;
    width: 380px;
    height: 100%;
}

#1


1  

Demo Fiddle

HTML

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

CSS

#left {
    background: url('http://www.dladziecibajki.com/tapety/21790373a4e876e9dfe1d3949a2d5345_1344597749.jpg') 0 0;
    height: 100%;
    overflow:hidden;
}
#right {
    float: left;
    width: 380px;
    height: 100%;
}