html - Links and Z-Index -


I am having a problem with a scroll effect where I can not get the link to work within the header Because the z -index should be negative for the effect, the links are in the header.

Edit Sorry, I was not quite clear, the links in the header area (green) are not active because the zayed index properties are to give heading area a negative index The link is not active, so I was thinking of a fix for this

HTML:

  & lt; Body & gt; & Lt; Div id = "container" & gt; & Lt; Div id = "navBar" & gt; & Lt; / Div & gt; & Lt; Div id = "headerBar" & gt; & Lt; / Div & gt; & Lt; Div id = "main content" & gt; & Lt; H1 & gt; This is the main content & lt; / H1> & Lt; / Div & gt; & Lt; / Div & gt; & Lt; / Body & gt;   

and CSS:

  #navbar {status: fixed; Top: 0; Left: 0; Width: 100%; Z-index: 1000; -MOZ-BOX-SHADOW: 0 0 5px # 000000; -WebKit box-shadow: 0 0 5px # 000000; Box-Shadow: 0 0 5px # 000000; Background: Red; Height: 50px; } #headerBar {top: 0; Height: 250px; Left: 0; Correct: 0; Margin: 0 px auto; Width: 100%; Status: fixed; Z-index: -1000; Background: green; } #mainContent {Overflow: Auto; Z-index: 0; Margin-top: 250px; Width: 100%; Height: 900px; } Body, # container {background: yellow; }    

Since there is no link in the code provided by you If there is a link in the "HeaderBoard" dev if it is the case, then you are not able to click on them because they will appear under the "navBar" div due to the styles provided by you.

If this is the effect you have, specify the margarine or padding for "headerbar" div, which will allow you to push the link given below "navbar".

Comments

Popular posts from this blog

excel vba - How to delete Solver(SOLVER.XLAM) code -

github - Teamcity & Git - PR merge builds - anyway to get HEAD commit hash? -

ios - Replace text in UITextView run slowly -