☆─────────────────────────────────────☆
cowell (紫禁飞狐) 于 (Thu Nov 14 22:33:46 2013) 提到:
代码很简单，就是一个表格里有3个div。
下面这段代码在IE中（我的是IE8）显示是对的，在Chrome中显示很奇怪。该如何纠正啊？花了半天时间死活解决不了。郁闷的是，我把代码传到网上，然后在同一电脑打开网上的，这下IE显示也有点变了。
我的目的是想让3个div保持在同一行，不换行。
急！求救！
<body>
<table id="crossRsltTable" style="width:100%; display:block; border:1px solid #F00">
<tr>
<td align="center" style="font-weight:bolder">
</td>
</tr>
<tr>
<td align="center" style="font-weight:bolder; background-color:#DDD; border-bottom:1px solid #BBB; border-right:1px solid #BBB;">
Result
</td>
</tr>
<tr>
<td>
<div id="crossColumn1" style="padding:5px; border:1px solid #CCC; display:inline-block; width:32%">text 1 </div>
<div id="crossColumn2" style="padding:5px; border:1px solid #CCC; display:inline-block; width:32%">text 2 </div>
<div id="crossColumn3" style="padding:5px; border:1px solid #CCC; display:inline-block; width:32%">text 3 </div>
</td>
</tr>
<tr>
<td>
<br />
</td>
</tr>
</table></body>
☆─────────────────────────────────────☆
liangqing (^-^) 于 (Thu Nov 14 22:59:58 2013) 提到:
<div id="crossColumn1" style="box-sizing:border-box;padding:5px; border:1px solid #CCC; display:inline-block; width:33.3%">text 1 </div><div id="crossColumn2" style="box-sizing:border-box;padding:5px; border:1px solid #CCC; display:inline-block; width:33.3%">text 2 </div><div id="crossColumn3" style="box-sizing:border-box;padding:5px; border:1px solid #CCC; display:inline-block; width:33.3%">text 3 </div>
注意，任意两个相邻的div之间都不能有空格。
【 在 cowell (紫禁飞狐) 的大作中提到: 】
: 代码很简单，就是一个表格里有3个div。
: 下面这段代码在IE中（我的是IE8）显示是对的，在Chrome中显示很奇怪。该如何纠正啊？花了半天时间死活解决不了。郁闷的是，我把代码传到网上，然后在同一电脑打开网上的，这下IE显示也有点变了。
: 我的目的是想让3个div保持在同一行，不换行。
: ...................
☆─────────────────────────────────────☆
cowell (紫禁飞狐) 于 (Fri Nov 15 07:07:39 2013) 提到:
太感谢了！确实解决了3个div不换行的问题。
还有个小问题：整个table是占页宽100%（由红色外框可以看出来），但是在Chrome中“Result”和下面的div却只在红色框里的很小一部分。
IE显示没有任何问题。
这个又应该如何解决呢？
【 在 liangqing 的大作中提到: 】
: <div id="crossColumn1" style="box-sizing:border-box;padding:5px; border:1px solid #CCC; display:inline-block; width:33.3%">text 1 </div><div id="crossColumn2" style="box-sizing:border-box;padding:5px; border:1px solid #CCC; display:inline-block; width:33.3%">text 2 </div><div id="crossColumn3" style="box-sizing:border-box;padding:5px; border:1px solid #CCC; display:inline-block; width:33.3%">text 3 </div>
: 注意，任意两个相邻的div之间都不能有空格。
:
☆─────────────────────────────────────☆
liangqing (^-^) 于 (Fri Nov 15 12:38:32 2013) 提到:
把table的display:block去掉
【 在 cowell (紫禁飞狐) 的大作中提到: 】
: 太感谢了！确实解决了3个div不换行的问题。
: 还有个小问题：整个table是占页宽100%（由红色外框可以看出来），但是在Chrome中“Result”和下面的div却只在红色框里的很小一部分。
: IE显示没有任何问题。
: ...................
☆─────────────────────────────────────☆
hellomykitty (山雨中的藥先生) 于 (Fri Nov 15 13:30:38 2013) 提到:
...
我今天纠结了半天一个事情还是以前自己写的代码，现在都看不懂了，chrome，opera测试无问题，ie完全无能。
烦死了。。
【 在 cowell (紫禁飞狐) 的大作中提到: 】
: 代码很简单，就是一个表格里有3个div。
: 下面这段代码在IE中（我的是IE8）显示是对的，在Chrome中显示很奇怪。该如何纠正啊？花了半天时间死活解决不了。郁闷的是，我把代码传到网上，然后在同一电脑打开网上的，这下IE显示也有点变了。
: 我的目的是想让3个div保持在同一行，不换行。
: ...................
☆─────────────────────────────────────☆
cowell (紫禁飞狐) 于 (Fri Nov 15 14:24:57 2013) 提到:
我滴神啊……
单独这段代码确实可以正常工作了。
但是，问题还是没能彻底解决。我的网页中需要用JS来控制display显示或是隐藏，显示的情况下应该用哪个呢？
我尝试了好几个，都不行。。。
:(
【 在 liangqing 的大作中提到: 】
: 把table的display:block去掉
☆─────────────────────────────────────☆
liangqing (^-^) 于 (Fri Nov 15 14:27:43 2013) 提到:
外面加一层div，或者切换设置display:table,display:none
【 在 cowell (紫禁飞狐) 的大作中提到: 】
: 我滴神啊……
: 单独这段代码确实可以正常工作了。
: 但是，问题还是没能彻底解决。我的网页中需要用JS来控制display显示或是隐藏，显示的情况下应该用哪个呢？
: ...................
☆─────────────────────────────────────☆
vonNeumann (劣币驱逐良币) 于 (Fri Nov 15 15:39:25 2013) 提到:
隐藏： .style.display = 'none';
显示： .style.display = '';
【 在 cowell (紫禁飞狐) 的大作中提到: 】
: 我滴神啊……
: 单独这段代码确实可以正常工作了。
: 但是，问题还是没能彻底解决。我的网页中需要用JS来控制display显示或是隐藏，显示的情况下应该用哪个呢？
: ...................
☆─────────────────────────────────────☆
cowell (紫禁飞狐) 于 (Fri Nov 15 15:55:00 2013) 提到:
多谢liangqing 和vonNeumann两位大神。
问题已彻底解决！
学习了！
【 在 vonNeumann 的大作中提到: 】
: 隐藏： .style.display = 'none';
: 显示： .style.display = '';
:
☆─────────────────────────────────────☆
Daughtry (蜗牛蜗牛你快跑！) 于 (Fri Nov 15 16:02:55 2013) 提到:
被同样的问题坑过