對齊SVG和跨度列表元素

我想對齊跨度到一個SVG圖像，但我掙扎。 Code和Codepen應該是自我解釋的。對齊SVG和跨度列表元素

HTML

<ul> 
    <li> 
    <svg>*SVG-CODE*</svg><span>Align me</span> 
    </li> 
</ul>

CSS

ul { 
    margin-left: 50px; 
    margin-top: 50px; 
    background: orange; 
} 

li { 
    background: blue; 
} 

svg { 
    vertical-align: middle; 
    margin-right: 20px; 
    height: 200px; 
    background: green; 
    alignment-baseline: central; 
} 

span { 
    background: red; 
    font-size: 100px; 
}

全碼：http://codepen.io/andreash/pen/zvwZjv

來源

2015-10-06 Andreas

你是說你想讓跨度像SVG廣場一樣垂直居中？如果是這樣的話，你可以像SVG一樣在span中添加「vertical-align：middle」。 –

啊..我的延緩大腦今天。我需要vertical-align：中間的svg和span。謝謝@AndyFurniss

來源

2015-10-06 09:38:56 Andreas

對齊SVG和跨度列表元素

回答

相關問題