Как правильно вставить форму в div в HTML/CSS?

Question

Я не могу понять это правильно. Это то, что у меня есть.

2 фонового изображения divs (для контента) и нижнего колонтитула. Я пытаюсь привязать форму к вершине div_11, но она идет на дно и скрывает ее части.

<div id="index-11_"> 
    <img src="xxx/ttt.jpg" alt="" width="1012" height="295" align="top" id="index_11" /> 
    <form> 
    <div class="form">FORM CODE</div> 
    </form> 
</div> 

<div id="index-12_"> 
    <img id="xxx/ccc.png" width="100" height="592" alt="" /> 
</div> 

Вот CSS:

#index-11_ { 
    position:absolute; 
    left:88px; 
    top:158px; 
    width:1012px; 
    height:295px; 
} 

div.box { 
    position:relative; 
    background:#222222; 
    width: 600px; 
    margin-left:auto; 
    margin-right:auto; 
    border:1px solid #262626; 
} 

#index-12_ { 
    position:absolute; 
    left:1100px; 
    top:158px; 
    width:100px; 
    height:592px; 
} 

Answer 1

Форма идет на дно, потому что вы его помещают после первого изображения. Похоже, вы хотите, чтобы элементы изображения были фоновыми изображениями div, вместо того, чтобы они были фактическими элементами в потоке html. Вы можете сделать так; добавьте в #index-11_ CSS:

background: url(xxx/ttt.jpg) no-repeat; 

заменить первый элемент изображения.

http://reference.sitepoint.com/css/background