Drupal在Firefox中查看帶網格選項的問題

Question

我最近爲一組圖像（可點擊縮略圖）從一組文件創建了一個drupal視圖。這是一個'視圖'格式：帶3列的網格。我裝在文件：路徑，標題，&標題和完成由「重寫結果」的觀點來自：使用下面的「文件標題」：

<div style="width:200px;"><td width="200px" ><a href="[uri]" style="max-width: 200px;">[field_title]<img src="[uri]" alt="ITSO" width="200px" style="width: 200px; max-width: 200px;" />[field_caption]</a></td></div> 

所以這部作品在Chrome和Safari很大，但是我的垮臺是Firefox瀏覽器。我試着用-moz來定義寬度，但是Firefox忽略了我放入的所有內容。它顯示標題，圖像非常大，它脫離窗口和標題，根本不調整大小。我最近的嘗試是使用邊界框但沒有運氣，下面顯示沒有變化。

<div style="width:200px; max-width: 200px; -webkit-column-width: 200px; -moz-column-width: 200px; column-width: 200px; -moz-box-sizing: border-box; display: inline-block; float: left;"><td width="200px" > <a href="[uri]" style="text-decoration:none; max-width: 200px;">[field_title]<img src="[uri]" alt="ITSO" width="200px" style="width: 200px; max-width: 200px;" />[field_caption]</a></td></div> 

當我改變它爲％而不是px定義時，我調整了圖像和列寬的Chrome大小，但Firefox沒有改變。

<div style="width:20%; max-width: 20%; -webkit-column-width: 20%; -moz-column-width: 20%; column-width: 20%; -moz-box-sizing: 20%; display: inline-block; float: left;"><td width="20%" > <a href="[uri]" style="text-decoration:none; max-width: 20%;">[field_title]<img src="[uri]" alt="ITSO" width="20%" style="width: 20%; max-width: 20%;" />[field_caption]</a></td></div> 

我也注意到，當我指定「文本修飾：無」，同時由鉻&火狐忽略。是不是內聯應該推翻？任何建議將不勝感激。我沒有完整的drupal權限，所以我不允許添加類或訪問管理員drupal區域，所以我很想找到一種方法來告訴所有瀏覽器在我的圖像上使用相同的寬度。

Answer 1

好吧，所以Firefox是問題所在。所有樣式寬度命令直接忽略。要做到這一點&使用方式視圖格式：網格是要重寫輸出用：

<div class="craxypic"><a href="[uri]">[field_title]<img src="[uri]" />[field_caption]</a></div> 

然後你必須把類craxypic在你的CSS文件，：

.craxypic { 
<td width="200px" > 
width: 200px; 
-webkit-column-width: 200px; 
-moz-column-width: 200px; 
column-width: 200px; 
-moz-box-sizing:border-box; 
display: inline-block; 
float: left; 
text-decoration:none; 
max-width: 200px; 
</td>} 

這是唯一的出路讓所有瀏覽器確認您的寬度命令。我仍然在學習drupal，在這一點上我不得不說要提醒我很多iraf。感謝您的討論。

Answer 2

你可以試着避免首先使用TD標籤嗎？我不確定，除非你把它包裝在表格中，否則TD將會工作。 此外，如果你可以編輯一些CSS嘗試，並避免使用網格，並使用無序列表，並顯示：inline-block;對LI元素或flexbox更好 這將允許您將所有沒有HTML的字段打印到單個字段的重寫函數中。它會使代碼清晰快速並且響應更快。