выравнивание изображения и метки в div

Question

У меня есть метка и изображение в div, которое действует как навигационная панель в мобильном приложении. Мне нужно, чтобы текст был по центру, а изображение - справа. Я не могу получить правильную комбинацию. Код здесь:

<div data-role="header"> 
    <div class="centered"> 
     <img src="../images/culogo50x40.png" alt="logo" height="25px" class="c1"> 
     <h3>Login</h3> 
    </div> 
</div> 

В классе по центру, у меня есть:

.centered { 
width: 100%; 
height: auto; 
position: fixed; 
top: 20%; 
background-color: red; 
text-align:center; 
-webkit-backface-visibility: hidden; 
} 

и в классе c1, у меня есть:

img.c1 { 
    float: right; 
    display: inline; 
} 

Answer 1

Вы можете position свой imgabsolute и сделать right:0; к плавайте. Для того, чтобы сделать его вертикальным среднее просто внести следующие изменения в свой стиль

img.c1 { 
    position: absolute; 
    right: 0; 
    top: 0; 
    bottom: 0; 
    margin: auto; 
} 

DEMO

ПРИМЕЧАНИЯ: margin:auto работает только либо с фиксированным width или height вашего элемент.