[英]div's with CSS property display:table-cell flickers
Whatever I do, I am not getting my div's flicker on loading. 无论我做什么,加载时都不会出现div的闪烁。
I have three main divs inside the content div
. 我在
content div
有三个主要content div
。 they are left, right and middle div
, Inside the middle div
I have dynamically created menus that I want the width to be equally divided to fit to the middle div. 他们是
left, right and middle div
,里面的middle div
我已动态创建,我想宽度平分,以适合中间格菜单。
CSS 的CSS
#content{
width: 1000px;
display: table;
}
#left, #right, #middle{
float: none;
vertical-align: top;
display: table-cell;
}
#left, #right{
width: 200px;
}
#middle{
width: 600px;
min-width: 600px;
}
.. HTML .. HTML
<div id="content">
<div id="left">very less text and images in this cell</div>
<div id="middle" style="<?php echo $middleWidth;?>">I have lot lots of images, hyperlinks and text in this page</div>
<div id="right">very less text and images in this cell</div>
</div>
PHP 的PHP
<?php
//some calculations..
$middleWidth = '602'.'px';
//this value is dynamic, I might get from 600px to any value that can be divided to get 0 remainder.
?>
while the website loads the page flickers, I can see the middle content taking width of 800px that is width of content div minus width of left div. 当网站加载页面闪烁时,我可以看到中间内容的宽度为800px,即内容div的宽度减去左div的宽度。 even though I am giving min-widht, max-width, the flickr is not at all stopping.
即使我给出最小宽度,最大宽度,该flickr也不停止。
One more challenge for me is thing should work on IE. 对我来说,另一个挑战是在IE上应该可以正常工作。
Please help me.. 请帮我..
This syntax is not correct 此语法不正确
<div id="content">
<div id="left">very less text and images in this cell</left>
<div id="middle" style="<?php echo $middleWidth;?>">I have lot lots of images, hyperlinks and text in this page</middle>
<div id="right">very less text and images in this cell</right>
</div>
</left>
</middle>
and </right>
is not valid html
. </left>
</middle>
和</right>
无效的html
。 Just close the divs normally </div>
只需正常关闭div
</div>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.