谷歌圖表工具提示中的DIV定位

我在google geochart工具提示中的某個div位置出現問題。谷歌圖表工具提示中的DIV定位

其中一些看起來很不錯，你可以在這裏看到

但薩姆看壞，因爲這裏（如果dropname div有一條線，該HEADER2格將移動到右）

和下面

return 
 
'<br><div id="country">'+ country + " - " + policy + '<br><br></div> ' + 
 
'<div id="header1">Dominant (E)PR policy model:<br></div>' + 
 
'<div id="dropname">'+dropname + '<br><br></div>' + 
 
'<div id ="header2">Since : </div><div id="date">' + startdate + '</div><br><br><br>' + 
 
'<div id ="comment">' + comment + '<\/div>'

#country{ 
 
\t font-size:16px; 
 
\t font-weight:500; 
 
\t } 
 

 
#header1{ 
 
\t font-size:14px; 
 
\t font-weight:400; 
 
\t color:#666; 
 
\t } 
 
#header2{ 
 
\t font-size:14px; 
 
\t font-weight:400; 
 
\t color:#666; 
 
\t } \t 
 

 
#date{ 
 
\t font-size:14px; 
 
\t font-weight:400; 
 
\t } 
 
#dropname{ 
 
\t font-size:14px; 
 
\t font-weight:400; 
 
\t display: inline-block; 
 
\t height:20px; 
 
\t } 
 

 
#comment{ 
 
\t font-size:12px; 
 
\t font-style:italic; 
 
\t font-weight:400; 
 
\t color:#06F; 
 
\t }

工具提示的代碼

我應該對每一組位置的div嗎？

來源

2017-05-06 Patcharapan

從#dropname聲明中刪除display: inline-block;。這會讓divs回到正常的塊級別，並且他們將被迫顯示一個在另一個之上。

另請儘量不要使用<br><br>。這不被認爲是最佳做法。相反，增加一些餘量，所以你的最後宣言是：

#dropname{ 
font-size: 14px; 
font-weight: 400; 
height: 20px; 
margin-bottom: 20px; 
}

其實我不喜歡人爲地設定「高度」的外觀有兩種，所以我就刪除了！ :)

來源

2017-05-06 19:10:45 mayersdesign

試過，但仍然一樣，我想因爲我設置了主DIV {display：inline-block}，但我設置了修復頁面上的另一個div，你可以在這裏看到頁面http：// sagisepr。 com/CLEANMAPS/test1menu.html如果我刪除，單選按鈕和img將位置錯誤。我不知道該怎麼做，希望你能幫助我，謝謝。 – Patcharapan

如果你添加了解決其他問題。然後在那個「別的東西」上添加一個新類，然後用display：inline-block樣式定位該類。你真的不應該像div {inline-block}那樣做一些「廣泛的事情」。你需要針對你需要做的具體事情，無論是通過class或id。 – mayersdesign

好的。實際上在上面的代碼中添加了「display：block」。這將「擊敗」您在別處設置的div {display：inline}。 – mayersdesign

谷歌圖表工具提示中的DIV定位

回答

相關問題