Div позиционирование над другим div

Я пытаюсь поместить div, который содержит интерактивную картинку на div, которая содержит фон. Тем не менее, это происходит постоянно:Div позиционирование над другим div

http://gyazo.com/2144dfe91b46898e125787b2f5249542

Он идет под изображением, и я не понимаю, почему.

вот мой код:

!DOCTYPE html> 
<html> 
<head> 
<title>SlammedPK</title> 
<link rel="shortcut icon" href="dragonclaws.png" type="image/x-icon"> 
<link rel="stylesheet" type="text/css" href="style.css"> 
    <style type"text/css"> 
    #title{ 
     height:100%; 
     width:100%; 
     display:inline-block; 
    } 
    #forum{ 
     height:10%; 
     width:10%; 
     background-image:forum.png; 
     display:block; 
    } 
    </style> 
</head> 
</body> 
<div id="container"> 
    <div id="title" style="position:relative" alt="title"> 
    <img src='fulltitle.png' style='width:100%;height:100%' alt='[]' /> 
    </div> 
    <div id="forum" style="position:absolute" alt="forum"> 
    <A HREF="http://google.com"><IMG SRC="forum.png" ALT="forum"></A> 
    </div> 
</div> 
</body> 
</html>

, если вы могли бы помочь, что было бы замечательно.

источник

2013-11-02 Finn Beckett-hester

Во-первых, ваш формат для фонового изображения неверен, вам необходимо background-image: url(forum.png); и то же самое для #title. Я не уверен, почему вы даете ему фоновое изображение, если у вас также есть img в нем, хотя

Что касается вашего вопроса, вы должны дать #containerposition:relative; или position:absolute. Абсолютно позиционируемые элементы должны быть ребенок или относительно позиционируемых родителя

источник

2013-11-02 19:41:12

Я добавил, что в форум css и я добавил 'background-image: fulltile.png;' в #title. Но ничего не изменилось? –

@ FinnBeckett-hester Я тупой, я обновил свое решение. Он должен исправить вашу проблему сейчас –

спасибо за вашу помощь, я очень благодарен! Хорошего дня! –

Я сделал это JsFiddle: http://jsfiddle.net/2c7eQ/

сводит #forum и #title являются position: absolute

HTML:

<div id="container"> 
    <div id="title"> 
    div1 
    </div> 
    <div id="forum"> 
    div2 
    </div> 
</div>

CSS:

#title{ 
     position: absolute; 
     border: 1px solid; 
     background-color: blue; 
     height:100%; 
     width:100%; 
} 
#forum{ 
     position: absolute; 
     left: 100px; 
     top: 100px; 
     border: 1px solid; 
     background-color: green; 
     height:10%; 
     width:10%; 
}

источник

2013-11-02 20:14:32 Laurent

Div позиционирование над другим div

ответ

Смежные вопросы