Как я могу расположить div между размещенными разделами со ссылками, но при этом получить доступ к ссылкам?

#html #css

#HTML #css

Вопрос:

У меня есть заголовок div, фиксированное положение в верхней части страницы.

Внутри него некоторые разделы расположены слева, а некоторые — справа, все со ссылками. У меня есть другой div, который я хочу расположить по центру страницы вертикально между ними.

Диаграмма:

 DivA  DivB         PageCenteredDiv     DivC DivD DivE
  

У меня div с центром по странице работает отлично:

 width:      100%;
text-align: center;
position:   fixed;
top:        0;
left:       0;
  

Но, независимо от того, что я делаю с z-index в любом из разделений, ссылки в размещенных разделениях находятся под расположенным по центру разделением, и на них нельзя щелкнуть.

Есть ли какой-либо способ разместить эти плавающие разделы над другим разделом?

Буду признателен за любую помощь!

Ответ №1:

Если вы можете установить ширину для div по центру:

 left: 50%;
margin-left: -150px;
position: absolute;
text-align: center;
top: 0;
width: 300px;
  

Это сделало бы div 300px шириной по центру внутри заголовка, не позволяя ему накладываться на размещенные разделы по бокам. Очевидно, что вы можете выбрать ширину в соответствии с содержимым.

Редактировать: я подготовил быструю демонстрацию на JSFiddle, чтобы вы могли увидеть, как это работает: http://jsfiddle.net/MartinodF/2gXKP