CSS: положение изображения в заголовке

Question

Я пытаюсь поместить логотип в середине заголовка и нажать на него. У меня проблема с размерами firefox (px, em,%), когда изображение находится в заголовке заголовка в chrome и IE9, в лисе, которое оно выходит из границы (переполнение?).

Есть ли способ разместить изображение или любой объект в этом вопросе в буттоме div во всех браузерах?

вот мой код, mybee это даст вам представление, что им делать worng:

CSS:

#header 
{ 
    background-image:url("../images/roundShapBrickWall.jpg"); 

    background-repeat:repeat-x; 

    position:relative; 
    width:inherit; 
    height:14.1em; 


} 
#header img 
{ 
    position:relative; // <--- somewhere here i think is the problem. 
    width:50%; 
    top:17%; 
} 

информация: это положение я хочу, чтобы иметь, он сидит в середине и buttom заголовка, но в firefox при выходе из границы заголовка.

любые идеи?

Answer 1

Вы пробовали: «позиция: абсолютная; нижняя: 0;» на ваш «#header img»?

Answer 2

Вы можете избежать использования position:relative и position:absolute, установив в #header раздел text-align: center и отрегулировать положение изображения с пометкой. Также можно установить вертикальное положение с запасом. Но это будет работать, только если у вас нет другого содержимого в заголовке.