HTML，CSS A HREF的text-align剩下一半了一半

我有這樣的例子代碼：HTML，CSS A HREF的text-align剩下一半了一半

<li><a href="#"><em>&euro; 2,75</em> Koffie</a></li>

女巫我不得不作出這樣的形象。「歐元2,75」右對齊「KOFFIE」左對齊 enter image description here

我已經試過迄今爲止的CSS：

em { 
float: right; 
} 
a { 
float: left; 
}

和

<li><a href="#"><em>&euro;<span style="float:right;"> 2,75</span></em> <span style="float:left;"> Koffie</span></a></li>

女巫工作在正常的文本上，但沒有任何這些作品。這甚至可能嗎？

來源

2015-07-21 Jim Vercoelen

你想什麼的截圖部分進行復制，併發生了什麼呢？不清楚究竟是什麼問題 –

噢，對於朦朧的歉意，我雖然很清楚：P 上面的鏈接有文本「歐元2,75」和「koffie」，我想要圖像的女巫，所以「歐元2 ，75「右對齊和」koffie「左對齊 –

這可能是使用'

'合理的一種情況。 – Anders

回答

li { 
 
    width: 200px; 
 
} 
 
.one { 
 
    float: left; 
 
    text-align: left; 
 
} 
 
.two { 
 
    float: right; 
 
    text-align: right; 
 
}

<li><a href="#"><span class="one"><em>Koffie</em></span><span class="two">&euro; 2,75</span></a></li>

來源

2015-07-21 20:40:12 NewsletterPoll

請避免代碼只有答案 - 而是解釋你做什麼和爲什麼。另外，'.one'上的'float'和'text-align'是否必要？ – Anders

是的，謝謝，這個作品！ –

吉姆沒問題。 – NewsletterPoll

相關問題