跨度文本換行與第一行對齊

Question

我有困難對齊第二行跨度，以便與第一行對齊，當發生換行時。

<div style="display: inline-block; vertical-align: middle"> 
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20"> 
<rect width="20" height="20" style="fill:rgb(0,167,206);"/> 
<text x="50%" y="14" text-anchor="middle" fill="white" font-size="10">' 
+(+counter)+ '</text></svg></div>' + " "+ "<b> 
<span style='margin-left:20px;'>" + data[i].metadata.LocationName+"</span></b>" 

如何將第二行中的文本與第一行對齊。這是它的外觀。任何幫助表示讚賞。顯示的文本是從服務中動態顯示的，因此我無法確定文本的長度。

Answer 1

顯然，在圓圈中的數字/平方米有float: left;。如果您可以訪問它們，請刪除float: left;，然後應用display: inline-block。這將防止隨後的文本在其下浮動。