仅仅修改样式的情况下，谁帮我心一下这段代码，使之在IE和FF均能正常显示

Yanbin_Q 2009-05-11 07:15:19



<HTML><HEAD><TITLE>Unmi 的个人空</TITLE>

<META http-equiv=Content-Type content="text/html; charset=utf-8">

<style type="text/css">

#content {

	OVERFLOW: hidden; ZOOM: 1

}

.xspace-layout1 #sideleft {

	FLOAT: left; WIDTH: 190px;

}



.xspace-layout1 .mainarea-side {

	FLOAT: right; MARGIN-LEFT: 200px! important; WIDTH: 700px

}

.xspace-layout1 DIV.mainarea-side {

	DISPLAY: inline; MARGIN-LEFT: 0px! important

}



.sidearea .xspace-blocktitle {

	LINE-HEIGHT: 24px; BORDER-BOTTOM: #600 1px solid; HEIGHT: 22px

}

#mainarea .xspace-blocktitle {

	BORDER-RIGHT: #6ea630 1px solid; BORDER-TOP: #6ea630 1px solid; #ffffd6; BORDER-LEFT: #6ea630 1px solid; LINE-HEIGHT: 28px; BORDER-BOTTOM: #6ea630 1px solid; HEIGHT: 26px

}



#wrap {

	BORDER-RIGHT: #969694 1px solid; PADDING-RIGHT: 2px; BORDER-TOP: #969694 1px solid; PADDING-LEFT: 2px; PADDING-BOTTOM: 10px; MARGIN: 1em auto auto; BORDER-LEFT: #969694 1px solid; WIDTH: 98%; PADDING-TOP: 10px; BORDER-BOTTOM: #969694 1px solid; TEXT-ALIGN: left

}



.xspace-sideblock {

	BORDER-RIGHT: #600 1px solid; BORDER-TOP: #600 1px solid;BORDER-LEFT: #600 1px solid; BORDER-BOTTOM: #600 1px solid

}



#mainarea{ 

    WIDTH: expression(document.getElementById('wrap').offsetWidth-document.getElementById('sideleft').offsetWidth-30); 

} 



</style>



</HEAD>

<BODY>

<DIV id=wrap>

    <DIV class=xspace-layout1 id=content>

        <DIV class=mainarea-side id=mainarea>

          <DIV class=xspace-blocktitle>我的日志</DIV>

        <DIV>



    </DIV></DIV>

    <DIV class=sidearea id=sideleft>

        <DIV class=xspace-sideblock>

            RSS订阅

        </DIV>

    </DIV>

    </DIV>

</DIV>

</BODY></HTML>

上面的代码在IE里用 expression 可以正常显示，即mainarea-side 充满右边剩余宽度，不管 IE 窗口如何拉大或变小，它与 sideleft 总能保持固定的间距。而在 FF 下浏览就有问题了，随着窗口宽度的变化，mainarea-side 和 sideleft 的间距在变化，且 mainarea-side 的宽度也未能如愿，其他浏览器是不理会 expression 的。

因为是为某个博客定制模板，只能加入自己的样式，JS 代码也不允许，并且其中的 HTML 代码是不能动的，所以想问一下各位达人，如何仅在修改 CSS 代码情况下，让它在 FF 下表现与 IE 下是一致的？

...全文

155 9 打赏收藏转发到动态举报

写回复

用AI写文章

9 条回复

切换为时间正序

请发表友善的回复…

发表回复

snow__ice 2009-05-12

打赏
举报

其实应该还有更好的解决方式。。

只是俺今天不愿意想了。。

家里只有ff3和ie6.别的浏览器没有测。

snow__ice 2009-05-12

打赏
举报

<HTML><HEAD><TITLE>Unmi 的个人空</TITLE>

<META http-equiv=Content-Type content="text/html; charset=utf-8">

<style type="text/css">

#wrap {

    BORDER-RIGHT: #969694 1px solid; PADDING-RIGHT: 2px; BORDER-TOP: #969694 1px solid; PADDING-LEFT: 2px; PADDING-BOTTOM: 10px; MARGIN: 1em auto auto; BORDER-LEFT: #969694 1px solid; WIDTH: 98%; PADDING-TOP: 10px; BORDER-BOTTOM: #969694 1px solid; TEXT-ALIGN: left

}



.xspace-sideblock {

    BORDER-RIGHT: #600 1px solid; BORDER-TOP: #600 1px solid;BORDER-LEFT: #600 1px solid; BORDER-BOTTOM: #600 1px solid

}



#content {

    OVERFLOW: hidden; ZOOM: 1

}

#sideleft {width: 190px;float:left;}

#mainarea{margin-left:200px;}

.xspace-blocktitle{_height:1px;float:right;width:100%;border: #6ea630 1px solid;LINE-HEIGHT: 28px; HEIGHT: 26px;}

.xspace-blocktitle{WIDTH: expression(document.getElementById('wrap').offsetWidth-document.getElementById('sideleft').offsetWidth-20); }

#sideleft{float:left;}

</style>



</HEAD>

<BODY>

<DIV id=wrap>

    <DIV class=xspace-layout1 id=content>

        <DIV class=mainarea-side id=mainarea>

          <DIV class=xspace-blocktitle>我的日志</DIV>

        <DIV></DIV>

		</DIV>

    	<DIV class=sidearea id=sideleft>

			<DIV class=xspace-sideblock>

				RSS订阅

			</DIV>

    	</DIV>

    </DIV>

</DIV>

</BODY></HTML>