Jim Vercoelen
Jim Vercoelen

Reputation: 1078

HTML-CSS a href text-align half left half right

I have this example code:

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

Witch I have to make like this the image. "euro 2,75" right-aligned "koffie" left-aligned enter image description here

What I have tried so far css:

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

and

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

witch has to work on a normal line text but none of these works. Is this even possible?

Upvotes: 2

Views: 3936

Answers (1)

NewsletterPoll
NewsletterPoll

Reputation: 554

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>

Upvotes: 3

Related Questions