Не удается щелкнуть ссылки, когда используется «position: relative»?

Вы можете увидеть проблему на стороне здесь: http://pages.bangor.ac.uk/~eeu41f/Не удается щелкнуть ссылки, когда используется «position: relative»?

Я использую position: relative на сторону тега, чтобы изменить z-index. Однако, к сожалению, это означает, что я не могу выделить текст или ссылки на любой текст, размещенный внутри. Удаление «position: relative» явно решает проблему, но это означает, что я не могу использовать z-index.

Можете ли вы придумать какие-либо решения?

aside, .top_aside { 
    position: relative; 
    z-index: -1; 
    float: left; 
    padding: 10px; 
    margin-left: -310px; 
} 


aside { 
    background: linear-gradient(rgb(0,200,0),rgb(0,175,0)); 
    width: 230px; 
    border-style: solid; 
    border-color: rgba(0,100,0,1); 
    border-top-width: 0px; 
    border-bottom-width: 0px; 
    border-left-width: 0px; 
    border-right-width: 80px; 
}

источник

2014-12-10 NylePudding

Пожалуйста, укажите ваш соответствующий код здесь, в вопросе. В любом случае, если вы не можете нажать ссылку, больше, это, вероятно, потому, что ваше значение z-index слишком мало. Проблема не в 'position: relative;', а 'z-index', так как последняя требует установки' position'. – TylerH

Какие ссылки вы не можете нажать? – vaso123

и добавьте ссылку внутри 'li', а не' li' внутри 'a'. Он должен быть: '

some text

' – vaso123

Просто добавьте стили тела:

body { 
position: relative; 
z-index: 0; 
}

источник

2014-12-10 16:48:34

Может быть немного рубить, но он должен сделать трюк:

Создать <div> с содержанием, которое в настоящее время в сторону, но поместить его за пределами вашей <aside>. Затем используйте относительное позиционирование, чтобы переместить его в правильное положение.

Также дайте вашему <aside> минимальную высоту, иначе он рухнет, если пуст.

Теперь эффект глубины сохраняется и текст должен быть доступен, а ссылки доступны.

CSS:

.pseudo-aside { 
width: 230px; 
position: relative; 
top: 18px; 
left: -308px; 
}

HTML:

<aside> 
</aside> 
<div class="pseudo-aside"> 
<p>Hello there, my name's </p> 
<hr> 
<h1>Llewelyn Gareth Griffiths</h1> 
<hr> 
<p>I'm currently studying Computer Science at Bangor University. This site is for any odds, ends, games or random things I make in my spare time. Feel free to have a click around or contact me using one of the following methods:</p> 
<hr> 
<p><a href="#">[email protected]</a></p> 
<p><a href="http://www.twitter.com/NylePudding">Twitter - @NylePudding</a></p> 
<p><a href="http://steamcommunity.com/id/NylePudding">Steam - NylePudding</a></p> 
</div>

источник

2014-12-10 16:43:48

Не удается щелкнуть ссылки, когда используется «position: relative»?

ответ

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