簡體   English   中英

IE中兩個相鄰div之間的Wierd Gap

[英]Wierd Gap between two adjacent div in IE

我在使用div的IE中遇到麻煩。 下面給出的是在FF和IE中查看的一組div的兩個圖像。

FF中的Div對齊

IE中的Div對齊

您會看到一條白線出現在邊框位置。 我正在動態創建此div。

<DIV style="WIDTH: 49px" class=ganttview-grid-row-cell sizset="36" sizcache07230265382227504="352">
<br/>
<DIV style="TEXT-ALIGN: center; WIDTH: 11px" class=ganttview-grid-row-cell-partition></DIV>
<br/>
<DIV style="TEXT-ALIGN: center; WIDTH: 11px" class=ganttview-grid-row-cell-partition></DIV>
<br/>
<DIV style="TEXT-ALIGN: center; WIDTH: 11px" class=ganttview-grid-row-cell-partition></DIV>
<br/>
<DIV style="TEXT-ALIGN: center; WIDTH: 11px" class="ganttview-grid-row-cell-partition last"></DIV><br/></DIV>

上面給出的是為div動態生成的代碼。 為div定義的類如下:

div.ganttview-grid-row-cell {
float: left;

/* IE problem */
position:relative;

/*top: 0;
left: 0;*/
z-index:0;

}

div.ganttview-grid-row-cell-partition {
border-right : 1px dotted #6B6659; 
font-size: 150%;
color: black;
height: 21px;
line-height: 120%; 
float : left;   

}

div.ganttview-grid-row-cell-partition.last {
border-right: none;
margin-right: 0px;

}

我在所有IE版本中都有這個差距。 不知道我要去哪里錯了。 我確實找到了與此有關的其他問題,並嘗試了所有方法,但均無法解決。 例如

1)添加

 <meta http-equiv="X-UA-Compatible" content="IE=EmulateIE8"/>

在頭標簽中。

2)將位置設置為絕對

3)將邊距填充全部設置為零。

經過一些測試后再增加一些點。 如前所述,它們是動態創建的div,下面是jquery中如何創建它的代碼。

for(var z = 1 ; z <= 4 ; z++ ) {                                                                        
                $i5MinPartition = jQuery("<div>", 
                        {   
                    "class": "ganttview-grid-row-cell-partition",
                    "css": { "width": ((cellWidth/4) - 1) + "px", "text-align": "center"} 
                        });
                if(bgData[count] && bgData[count].workloadValue >= j) {
                    $i5MinPartition.css({"background": "#669900"});
                }
                if(bgData[count] && bgData[count].scheduleAllocationValue >= j) {
                    $i5MinPartition.text('x');
                }                       
                cellDiv.append($i5MinPartition);

                count++;
            }

這里的cellWidth是50。現在,我發現IE的寬度不采用十進制值,而Firefox卻采用十進制值。

等式

(cellWidth / 4)-1

在FF中給出11.5,而在IE中給出11。

請幫忙。

提前致謝。

嗨,嘗試將其添加到父元素。

font-size: 0

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM