CODEWITHSUNDEEP
htmlcss
Kratalin Jan
Kratalin Jan

Reputation: 105

image, then align text to right

At this moment, I have:

HTML:

<div class="menu">
    <img src="logo.png" alt="6" />
    <a href="1.html" title="1" id="ton">Hendrerit</a>
    <a href="2.html" title="2" id="ton">Phasellus</a>
</div>

CSS:

.menu img {
    vertical-align: middle;
}
.menu a#ton:link,
.menu a#ton:visited,
.menu a#ton:active {
    display: inline-block;
    padding: 19px;
}

JSFiddle: http://jsfiddle.net/BT5K9/

Which is the best way to align links to right? I want only for modern browsers, so I guess it's something simple. text-align don't work in my case because of the display: inline-block, I guess. Maybe without float? Thanks.

Upvotes: 0

Views: 117

Answers (2)

WhatisSober
WhatisSober

Reputation: 988

If you donot want to use float:

.menu img
{
display: block;
text-align: left;
position: absolute;
}

.menu a
{
text-align: right; 
display:block;  
}

here is jsfidle

Upvotes: 0

Chris Mukherjee
Chris Mukherjee

Reputation: 841

If you're not against using span or float, here's a solution: jsFiddle

Upvotes: 1

Related Questions