响应格,而不影响中心DIV
问题描述:
<div id="leftdiv" style="height:200px;width:15%;float:left"></div>
<div id="centerdiv" style="height:200px;width:70%;float:left"></div>
<div id="rightdiv" style="height:200px;width:15%;float:left"></div>
这三个DIV 我需要leftdiv和rightdiv响应,但centerdiv保持在相同的位置响应格,而不影响中心DIV
答
你的问题是缺乏的实际问题是什么但任何真正的解释基于你的演示链接,似乎你正试图重写内联样式。
这对于纯CSS并不可行,因为内联样式几乎总是会赢得特定的战争。
最好将样式作为基础样式移动到样式表中,然后根据媒体查询进行更改。
* {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
div {
height: 200px;
float: left;
}
#leftdiv {
background: red;
width: 15%;
}
#centerdiv {
background: blue;
width: 70%;
}
#rightdiv {
background: green;
width: 15%;
}
@media screen and (max-width: 600px) {
#leftdiv {
background: red;
width: 5%;
}
#centerdiv {
background: blue;
width: 90%;
}
#rightdiv {
background: green;
width: 5%;
}
}
<div id="leftdiv"></div>
<div id="centerdiv"></div>
<div id="rightdiv"></div>
目前尚不清楚你的要求。 - https://jsfiddle.net/6m2ne08k/ –
寻求调试帮助的问题(“为什么这个代码不工作?”)必须包含所需的行为,特定的问题或错误。 –
https://jsfiddle.net/6m2ne08k/3 –