61,112
社区成员
发帖
与我相关
我的任务
分享div+css拉动页面宽度时出现的奇怪问题，求高人！
做了个圆角效果，在页面中看着正常，但只要拉动页面的宽度，最右的图片就会出现问题，而且是页面宽度增加/缩小一个px才会出现，再增加/缩小一个px又正常了。
分析了一下，感觉是拉动一个px的时候，中间的那个div的宽度增加了，但右边的没动，再拉动一个px，右边才动，也就是说右边的层要每拉动2个px才有反映。
很急，大家帮忙看看，，演示代码在下面，才2k。
http://www.firecn.net/jeff/test.rar (2k)
分析了一下，感觉是拉动一个px的时候，中间的那个div的宽度增加了，但右边的没动，再拉动一个px，右边才动，也就是说右边的层要每拉动2个px才有反映。
很急，大家帮忙看看，，演示代码在下面，才2k。
http://www.firecn.net/jeff/test.rar (2k)
...全文
请发表友善的回复…
发表回复
zc_0101 2008-06-20
- 打赏
- 举报
将您的代码大致做以下三处修改，问题解决：
一、两边的图片采用<img src="">的方式直接插入div
二、将内部Div的margin和padding值都设置为0px;
三、div排列采用float方式，该左的左，该右的右，问题解决。
代码如下：
一、两边的图片采用<img src="">的方式直接插入div
二、将内部Div的margin和padding值都设置为0px;
三、div排列采用float方式，该左的左，该右的右，问题解决。
代码如下：
<HTML>
<HEAD>
<title>DWDA</title>
<style type="text/css">
<!--
#topBorderBox{padding:0px;}
#topBorder
{
margin:0px; padding:0px;
background:#fff url(topBg.gif);
height:12px;
position:relative;
}
#topLeft{
margin:0px; padding:0px;
width:12px;
height:12px;
float:left;
}
#topRight{
margin:0px; padding:0px;
width:12px;
height:12px;
float:right;
}
--></style>
</HEAD>
<BODY bgcolor=#2d82b1 style="padding:10px;">
<div id="topBorderBox" >
<div id="topBorder">
<div id="topLeft"><img src="leftTop.gif" /></div>
<div id="topRight"><img src="rightTop.gif" /></div>
</div>
</div>
</BODY>
</HTML>
sjmlsxp 2008-06-20
- 打赏
- 举报
所以我看不到问题
不好意思 爱莫能助啊
不好意思 爱莫能助啊
jeff_107 2008-06-20
- 打赏
- 举报
是哦，，，ie7好象没问题，，ie6里拉动的时候有问题
sjmlsxp 2008-06-20
- 打赏
- 举报
你是在IE6中测试的？
ruanchao 2008-06-20
- 打赏
- 举报
一起关注一下吧，呵呵
